1. Web
  2. Web API
  3. HTMLMediaElement

HTMLMediaElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

Giao diện HTMLMediaElement thêm vào HTMLElement các thuộc tính và phương thức cần thiết để hỗ trợ các khả năng cơ bản liên quan đến phương tiện phổ biến đối với âm thanh và video.

Các phần tử HTMLVideoElement và HTMLAudioElement đều kế thừa giao diện này.

EventTarget Node Element HTMLElement HTMLMediaElement

Thuộc tính thể hiện

Giao diện này cũng kế thừa các thuộc tính từ tổ tiên của nó HTMLElement, Element, Node, và EventTarget.

  • HTMLMediaElement.audioTracks Read only

  • : AudioTrackList liệt kê các đối tượng AudioTrack có trong phần tử.

  • HTMLMediaElement.autoplay

  • : Giá trị boolean phản ánh thuộc tính HTML autoplay, cho biết liệu quá trình phát lại có tự động bắt đầu ngay khi có đủ phương tiện để thực hiện việc đó mà không bị gián đoạn hay không.

    > [!NOTE]

    Tự động phát âm thanh khi người dùng không mong đợi hoặc mong muốn đó là trải nghiệm người dùng kém và nên tránh trong hầu hết các trường hợp, mặc dù vẫn có trường hợp ngoại lệ. Xem Autoplay guide for media and Web Audio APIs để biết thêm thông tin. Hãy nhớ rằng trình duyệt có thể bỏ qua các yêu cầu tự động phát, vì vậy bạn nên đảm bảo rằng mã của bạn không phụ thuộc vào hoạt động tự động phát.

  • HTMLMediaElement.buffered Read only

  • : Trả về đối tượng TimeRanges cho biết phạm vi của nguồn phương tiện mà trình duyệt đã lưu vào bộ đệm (nếu có) tại thời điểm thuộc tính buffered được truy cập.

  • HTMLMediaElement.controls

  • : Một boolean phản ánh thuộc tính HTML controls, cho biết liệu các mục giao diện người dùng để kiểm soát tài nguyên có được hiển thị hay không.

  • HTMLMediaElement.controlsList

  • : Trả về DOMTokenList giúp tác nhân người dùng chọn những điều khiển nào sẽ hiển thị trên thành phần phương tiện bất cứ khi nào tác nhân người dùng hiển thị bộ điều khiển của chính nó. DOMTokenList nhận một hoặc nhiều hơn trong số ba giá trị có thể có: nodownload, nofullscreen và noremoteplayback.

  • HTMLMediaElement.crossOrigin

  • : Một chuỗi biểu thị CORS setting cho phần tử phương tiện này.

  • HTMLMediaElement.currentSrc Read only

  • : Trả về một chuỗi có URL tuyệt đối của tài nguyên phương tiện đã chọn.

  • HTMLMediaElement.currentTime

  • : Giá trị dấu phẩy động có độ chính xác kép cho biết thời gian phát lại hiện tại tính bằng giây; nếu phương tiện chưa bắt đầu phát và chưa được tìm kiếm thì giá trị này là thời gian phát lại ban đầu của phương tiện. Đặt giá trị này sẽ tìm kiếm phương tiện truyền thông theo thời gian mới. Thời gian được chỉ định tương ứng với dòng thời gian của phương tiện truyền thông.

  • HTMLMediaElement.defaultMuted

  • : Một boolean phản ánh thuộc tính HTML muted, cho biết liệu đầu ra âm thanh của thành phần đa phương tiện có nên bị tắt tiếng theo mặc định hay không.

  • HTMLMediaElement.defaultPlaybackRate

  • : A double cho biết tốc độ phát lại mặc định cho phương tiện.

  • HTMLMediaElement.disableRemotePlayback

  • : Boolean đặt hoặc trả về trạng thái phát lại từ xa, cho biết liệu phần tử phương tiện có được phép có giao diện người dùng phát lại từ xa hay không.

  • HTMLMediaElement.duration Read only

  • : Giá trị dấu phẩy động có độ chính xác kép chỉ đọc cho biết tổng thời lượng của phương tiện tính bằng giây. Nếu không có sẵn dữ liệu đa phương tiện thì giá trị trả về là NaN. Nếu phương tiện có độ dài không xác định (chẳng hạn như phương tiện truyền trực tiếp, phương tiện của cuộc gọi WebRTC hoặc tương tự), thì giá trị là Infinity.

  • HTMLMediaElement.ended Read only

  • : Trả về một boolean cho biết phần tử media đã phát xong hay chưa.

  • HTMLMediaElement.error Read only

  • : Trả về đối tượng MediaError cho lỗi gần đây nhất hoặc null nếu không có lỗi.

  • HTMLMediaElement.loading

  • : Một chuỗi cho biết trình duyệt nên tải phương tiện ngay lập tức (eager) hay khi cần (lazy). Xem các thuộc tính HTML <video loading> và <audio loading> để biết thêm thông tin.

  • HTMLMediaElement.loop

  • : Một boolean phản ánh thuộc tính HTML loop, cho biết liệu phần tử phương tiện có nên bắt đầu lại khi nó kết thúc hay không.

  • HTMLMediaElement.mediaKeys Read only Secure context

  • : Trả về đối tượng MediaKeys, đó là một tập hợp các khóa mà phần tử có thể sử dụng để giải mã dữ liệu đa phương tiện trong khi phát lại. Nếu không có khóa nào thì có thể là null.

  • HTMLMediaElement.muted

  • : Một boolean xác định xem âm thanh có bị tắt tiếng hay không. true nếu âm thanh bị tắt tiếng và false nếu ngược lại.

  • HTMLMediaElement.networkState Read only

  • : Trả về unsigned short (liệt kê) cho biết trạng thái hiện tại của việc tìm nạp phương tiện qua mạng.

  • HTMLMediaElement.paused Read only

  • : Trả về một boolean cho biết phần tử media có bị tạm dừng hay không.

  • HTMLMediaElement.playbackRate

  • : double cho biết tốc độ phát lại phương tiện.

  • HTMLMediaElement.played Read only

  • : Trả về đối tượng TimeRanges chứa phạm vi nguồn phương tiện mà trình duyệt đã phát, nếu có.

  • HTMLMediaElement.preload

  • : Một chuỗi phản ánh thuộc tính HTML preload, cho biết dữ liệu nào sẽ được tải trước, nếu có. Các giá trị có thể có là: none, metadata, auto.

  • HTMLMediaElement.preservesPitch

  • : Giá trị boolean xác định xem cao độ của âm thanh có được giữ nguyên hay không. Nếu được đặt thành false, cao độ sẽ điều chỉnh theo tốc độ của âm thanh.

  • HTMLMediaElement.readyState Read only

  • : Trả về unsigned short (liệt kê) cho biết trạng thái sẵn sàng của phương tiện.

  • HTMLMediaElement.remote Read only

  • : Trả về một phiên bản đối tượng RemotePlayback được liên kết với phần tử media.

  • HTMLMediaElement.seekable Read only

  • : Trả về đối tượng TimeRanges chứa khoảng thời gian mà người dùng có thể tìm kiếm, nếu có.

  • HTMLMediaElement.seeking Read only

  • : Trả về một boolean cho biết liệu phương tiện có đang trong quá trình tìm kiếm vị trí mới hay không.

  • HTMLMediaElement.sinkId Read only Secure context

  • : Trả về một chuỗi là ID duy nhất của thiết bị âm thanh cung cấp đầu ra hoặc một chuỗi trống nếu thiết bị âm thanh mặc định của tác nhân người dùng đang được sử dụng.

  • HTMLMediaElement.src

  • : Một chuỗi phản ánh thuộc tính HTML src, chứa URL của tài nguyên phương tiện sẽ sử dụng.

  • HTMLMediaElement.srcObject

  • : Một đối tượng đóng vai trò là nguồn của phương tiện được liên kết với HTMLMediaElement hoặc null nếu không được chỉ định.

  • HTMLMediaElement.textTracks Read only

  • : Trả về đối tượng TextTrackList chứa danh sách các đối tượng TextTrack có trong phần tử.

  • HTMLMediaElement.videoTracks Read only

  • : Trả về đối tượng VideoTrackList chứa danh sách các đối tượng VideoTrack có trong phần tử.

  • HTMLMediaElement.volume

  • : A double cho biết âm lượng âm thanh, từ 0,0 (im lặng) đến 1,0 (to nhất).

Thuộc tính lỗi thời

Các thuộc tính này đã lỗi thời và không nên sử dụng, ngay cả khi trình duyệt vẫn hỗ trợ chúng.

  • HTMLMediaElement.controller
  • : Đối tượng MediaController đại diện cho bộ điều khiển phương tiện được gán cho phần tử hoặc null nếu không được chỉ định.
  • HTMLMediaElement.mediaGroup
  • : Một chuỗi phản ánh thuộc tính HTML mediagroup, cho biết tên của nhóm phần tử mà nó thuộc về. Một nhóm các thành phần truyền thông có chung MediaController.
  • HTMLMediaElement.mozAudioCaptured Read only
  • : Trả về một boolean. Liên quan đến việc ghi lại luồng âm thanh.
  • HTMLMediaElement.mozFragmentEnd
  • : double cung cấp quyền truy cập vào thời gian kết thúc phân đoạn nếu phần tử phương tiện có URI phân đoạn cho currentSrc, nếu không thì nó bằng thời lượng phương tiện.

Phương thức thể hiện

Giao diện này cũng kế thừa các phương thức từ tổ tiên của nó HTMLElement, Element, Node, và EventTarget.

  • HTMLMediaElement.addTextTrack()
  • : Thêm đối tượng TextTrack mới (chẳng hạn như bản nhạc dành cho phụ đề) vào thành phần phương tiện. Đây chỉ là giao diện lập trình và không ảnh hưởng đến DOM.
  • HTMLMediaElement.captureStream()
  • : Trả về MediaStream, ghi lại luồng nội dung đa phương tiện.
  • HTMLMediaElement.canPlayType()
  • : Cho một chuỗi chỉ định loại phương tiện MIME (có thể bao gồm codecs parameter), canPlayType() trả về chuỗi probably nếu phương tiện có thể phát được, maybe nếu không có đủ thông tin để xác định liệu phương tiện có phát hay không hoặc một chuỗi trống nếu phương tiện không thể phát.
  • HTMLMediaElement.fastSeek()
  • : Tìm kiếm nhanh chóng thời gian nhất định với độ chính xác thấp.
  • HTMLMediaElement.getStartDate()
  • : Trả về một đối tượng Date đại diện cho ngày và giờ trong thế giới thực tương ứng với thời điểm bắt đầu của phương tiện. Đối với luồng trực tiếp, đây là thời điểm bắt đầu phát sóng trên máy chủ, có thể là trước khi người dùng bắt đầu xem.
  • HTMLMediaElement.load()
  • : Đặt lại phương tiện về đầu và chọn nguồn có sẵn tốt nhất từ ​​các nguồn được cung cấp bằng thuộc tính src hoặc phần tử <source>.
  • HTMLMediaElement.pause()
  • : Tạm dừng phát lại media.
  • HTMLMediaElement.play()
  • : Bắt đầu phát lại media.
  • HTMLMediaElement.seekToNextFrame()
  • : Tìm kiếm khung hình tiếp theo trong phương tiện. Phương pháp thử nghiệm, phi tiêu chuẩn này cho phép điều khiển việc đọc và hiển thị phương tiện theo cách thủ công ở tốc độ tùy chỉnh hoặc di chuyển qua từng khung hình phương tiện để thực hiện lọc hoặc các hoạt động khác.
  • HTMLMediaElement.setMediaKeys() Secure context
  • : Trả về Promise. Đặt các phím MediaKeys để sử dụng khi giải mã phương tiện trong khi phát lại.
  • HTMLMediaElement.setSinkId() Secure context
  • : Đặt ID của thiết bị âm thanh sẽ sử dụng cho đầu ra và trả về Promise. Điều này chỉ hoạt động khi ứng dụng được phép sử dụng thiết bị được chỉ định.

Phương thức lỗi thời

Các phương pháp này đã lỗi thời và không nên sử dụng, ngay cả khi trình duyệt vẫn hỗ trợ chúng.

  • HTMLMediaElement.mozCaptureStream()
  • : Tương đương với tiền tố Firefox của HTMLMediaElement.captureStream(). Xem browser compatibility của nó để biết chi tiết.
  • HTMLMediaElement.mozCaptureStreamUntilEnded()
  • : Một phương pháp không chuẩn, không được dùng nữa để thu hơi nước cho đến khi nó kết thúc.
  • HTMLMediaElement.mozGetMetadata()
  • : Trả về Object, chứa các thuộc tính đại diện cho siêu dữ liệu từ tài nguyên phương tiện đang phát dưới dạng cặp {key: value}. Một bản sao dữ liệu riêng biệt được trả về mỗi lần phương thức được gọi. Phương thức này phải được gọi sau khi sự kiện loadedmetadata xảy ra.

Sự kiện

Kế thừa các sự kiện từ cha mẹ của nó, HTMLElement.

Nghe những sự kiện này bằng cách sử dụng addEventListener() hoặc bằng cách chỉ định trình xử lý sự kiện cho thuộc tính oneventname của giao diện này.

  • abort
  • : Được kích hoạt khi tài nguyên chưa được tải đầy đủ nhưng không phải do lỗi.
  • canplay
  • : Được kích hoạt khi tác nhân người dùng có thể phát phương tiện nhưng ước tính rằng không đủ dữ liệu đã được tải để phát phương tiện đến hết mà không phải dừng để lưu thêm nội dung vào bộ đệm.
  • canplaythrough
  • : Được kích hoạt khi tác nhân người dùng có thể phát phương tiện và ước tính rằng đủ dữ liệu đã được tải để phát phương tiện cho đến hết mà không cần phải dừng để lưu thêm nội dung vào bộ đệm.
  • durationchange
  • : Được kích hoạt khi thuộc tính thời lượng đã được cập nhật.
  • emptied
  • : Kích hoạt khi thẻ nhớ đã trống; ví dụ: khi phương tiện đã được tải (hoặc được tải một phần) và phương thức HTMLMediaElement.load() được gọi để tải lại nó.
  • encrypted
  • : Được kích hoạt khi tìm thấy dữ liệu khởi tạo trong phương tiện cho biết phương tiện đã được mã hóa.
  • ended
  • : Được kích hoạt khi quá trình phát lại dừng khi kết thúc phương tiện (<audio> hoặc <video>) hoặc do không có thêm dữ liệu.
  • error
  • : Được kích hoạt khi không thể tải tài nguyên do lỗi.
  • loadeddata
  • : Được kích hoạt khi khung đầu tiên của phương tiện đã tải xong.
  • loadedmetadata
  • : Được kích hoạt khi siêu dữ liệu đã được tải.
  • loadstart
  • : Được kích hoạt khi trình duyệt bắt đầu tải tài nguyên.
  • pause
  • : Được kích hoạt khi yêu cầu tạm dừng phát được xử lý và hoạt động đã chuyển sang trạng thái tạm dừng, thường xảy ra nhất khi phương thức HTMLMediaElement.pause() của phương tiện được gọi.
  • play
  • : Được kích hoạt khi thuộc tính paused được thay đổi từ true thành false, do phương thức HTMLMediaElement.play() hoặc thuộc tính autoplay.
  • playing
  • : Được kích hoạt khi quá trình phát lại sẵn sàng bắt đầu sau khi bị tạm dừng hoặc bị trì hoãn do thiếu dữ liệu.
  • progress
  • : Được kích hoạt định kỳ khi trình duyệt tải tài nguyên.
  • ratechange
  • : Kích hoạt khi tốc độ phát lại đã thay đổi.
  • seeked
  • : Được kích hoạt khi thao tác tìm kiếm hoàn tất.
  • seeking
  • : Được kích hoạt khi hoạt động tìm kiếm bắt đầu.
  • stalled
  • : Được kích hoạt khi tác nhân người dùng đang cố gắng tìm nạp dữ liệu phương tiện, nhưng dữ liệu không được gửi đến.
  • suspend
  • : Được kích hoạt khi quá trình tải dữ liệu đa phương tiện bị tạm dừng.
  • timeupdate
  • : Được kích hoạt khi thời gian được chỉ định bởi thuộc tính currentTime đã được cập nhật.
  • volumechange
  • : Kích hoạt khi âm lượng đã thay đổi.
  • waiting
  • : Được kích hoạt khi quá trình phát lại đã dừng do thiếu dữ liệu tạm thời.
  • waitingforkey
  • : Được kích hoạt khi quá trình phát lại bị chặn lần đầu trong khi chờ phím.

Đặc tả kỹ thuật

Specification
HTML
# htmlmediaelement

Tương thích trình duyệt

Xem thêm

Tài liệu tham khảo

Hướng dẫn

Help improve MDN

Learn how to contribute

This page was last modified on by MDN contributors.

View this page on GitHub • Report a problem with this content