Thẻ tạo trình phát âm thanh trên trang web
Nó hỗ trợ các điều khiển phương tiện, như phát, tạm dừng, âm lượng và tắt tiếng
Người chơi có điều khiển. phát, tạm dừng, âm lượng, v.v.
Ghi chú. Theo mặc định, trình phát không có hình ảnh đại diện và ẩn. Thêm thuộc tính điều khiển làm cho nó xuất hiện [i. e. có thể nhìn thấy]
Thẻ tham chiếu một hoặc nhiều tệp âm thanh có thuộc tính src hoặc phần tử
Trình duyệt sẽ chọn tệp đầu tiên có định dạng tệp mà nó hỗ trợ
Các định dạng tệp âm thanh được hỗ trợ bao gồm MP3, WAV và OGG
Một thẻ chỉ định hai tệp âm thanh.
Trình duyệt sử dụng loại tệp đầu tiên mà nó hỗ trợ.
Trình duyệt của bạn không hỗ trợ yếu tố âm thanh
Your browser does not support audio element.
Giải thích mã
- xác định một yếu tố âm thanh- điều khiển - cho phép điều khiển âm thanh. phát, tạm dừng, âm lượng, tắt tiếng và tải xuống
- - xác định nguồn tệp âm thanh
- src - URL hoặc tên tệp của âm thanh để phát
- loại - định dạng tệp của âm thanh
Ghi chú. Đối với nhiều nguồn, loại tệp được hỗ trợ đầu tiên sẽ phát
Bảng này liệt kê các thuộc tính thẻ
Thuộc tính Giá trị được chấp nhậnMô tảđiều khiểnkhông có giá trịBật điều khiển âm thanh như phát/tạm dừng, âm lượng và các điều khiển khác. srcURLURL tệp âm thanh / đường dẫn. id số nhận dạng Xác định một số nhận dạng duy nhất cho âm thanh. class classnamesĐặt một hoặc nhiều lớp CSS được áp dụng cho âm thanh. style CSS-stylesĐặt kiểu cho âm thanh. data-* valueXác định dữ liệu bổ sung mà JavaScript có thể sử dụng.
hidden hiddenChỉ định âm thanh có bị ẩn hay không. title giá trịĐặt tiêu đề hiển thị dưới dạng chú giải công cụ. autoplayno valueCho trình duyệt biết rằng âm thanh sẽ bắt đầu phát ngay lập tứcloopno valueChỉ định rằng âm thanh được lặp lại mỗi khi nó hoàn thànhmutedno valueCho trình duyệt biết rằng âm thanh phải được tắt tiếng [im lặng]. preloadauto
siêu dữ liệu
noneChỉ định cách tệp âm thanh được tải sau khi trang đã được tảicrossoriginanonymous
use-credentialsChỉ định cách xử lý yêu cầu crossorigin.
Để biết các thuộc tính toàn cầu bổ sung, hãy xem danh sách thuộc tính toàn cầu của chúng tôi
Bảng này liệt kê các định dạng âm thanh mà mỗi trình duyệt hỗ trợ
Trình duyệtMP3WAVOGG
Các loại phương tiện cho tệp âm thanh
Đây là các loại phương tiện cho từng định dạng tệp âm thanh
FormatMedia-typeMP3audio/mpegOGGaudio/oggWAVaudio/wav
Thẻ có thuộc tính vòng lặp.
Tệp âm thanh sẽ phát lặp lại.
Thẻ có thuộc tính tắt tiếng.
Thuộc tính này tắt tiếng [im lặng] âm thanh. Nó chơi nhưng không có âm thanh.
Phần tử hiển thị một DOM [Mô hình đối tượng tài liệu].
Điều này cho phép JavaScript kiểm soát âm thanh theo chương trình.
Các nút phát và tạm dừng một ẩn bằng JavaScript
Vui lòng nâng cấp trình duyệt của bạn để phát âm thanh. Tạm dừng chơi
Please upgrade your browser to play audio.
Play
Pause
Phát phần tử âm thanh trong bộ nhớ
JavaScript có thể tạo phần tử âm thanh trong bộ nhớ và sau đó phát tệp âm thanh
Nhấp vào nút phát và JavaScript sẽ phát tệp âm thanh -- tất cả đều không có thẻ
Play
Thẻ là một phần của nhóm thẻ tạo trải nghiệm đa phương tiện trên web. Nhóm này được gọi là nhóm thẻ Media. Cùng với nhau, chúng cho phép bạn tạo ra các giải pháp đa phương tiện mạnh mẽ
Vấn đề&Giải pháp.
Bạn có tệp âm thanh. Làm cách nào để đặt nó vào HTML? .
Mục đích của nhiệm vụ này.
Tìm hiểu cách chèn âm thanh vào HTML.
Nhiệm vụ.
Chèn một số tệp âm thanh WAV vào HTML bằng trình soạn thảo văn bản đơn giản.
Lưu ý. Có hai khả năng. chèn WAV như một liên kết và nhúng trực tiếp WAV vào HTML. Bạn phải nhận ra cả hai phương pháp.
Yêu cầu
- Netscape Navigator với LiveAudio plug-in hoặc Internet Explorer với ActiveX plug-in
Trong nhiệm vụ này, bạn có thể sử dụng các tệp WAV được xác định trước. Có 3 tệp trong bài tập này. Các thông số của các tệp WAV này bạn có thể tìm thấy trong bảng bên dưới. TênMô tảâm thanh1. wav 8000 Hz, 8 bit, âm thanh đơn âm 2. wavT16000 Hz, 8 bit, monoaaudio3. wav24000 Hz, 8 bit, đơn âm
Ghi chú. tên tệp phân biệt chữ hoa chữ thường
Phần I. Tệp WAV dưới dạng liên kết.
Các bước công việc.
- Viết vào tệp WAV nguồn HTML giữa và các thẻ
- Nhấn nút "Xem". Bạn sẽ thấy một liên kết đến tệp HTML của mình. Nếu bạn nhấp vào liên kết này, bạn sẽ được nhắc Lưu tệp này vào đĩa hoặc nếu trình duyệt của bạn có trình cắm hỗ trợ tệp WAV, bạn sẽ có thể nghe tệp của mình
Đây là cách đơn giản nhất để chèn tệp WAV vào HTML. Bây giờ chúng ta sẽ xem xét phương pháp thứ hai.
Trước khi đọc cách chèn âm thanh vào HTML bằng thẻ.
Phần II. Tệp WAV được nhúng vào HTML.
Các bước công việc.
- Viết trong nguồngiữa và thẻ
- Nhấn nút "Xem". Bạn sẽ thấy trình phát âm thanh được nhúng trong cửa sổ trình duyệt của mình. Chế độ xem tùy thuộc vào trình duyệt của bạn. Bạn có thể phát âm thanh, tạm dừng hoặc dừng âm thanh
- Cố gắng thêm hai hoặc ba tệp WAV vào HTML
- Đặt chúng lên bàn
- So sánh sự khác biệt về chất lượng giữa các tệp
Kết luận.
Bây giờ bạn thấy rằng có nhiều khả năng tạo trang tương tác với thẻ hơn là với ý nghĩa liên kết.
Quay lại ghi chú bài giảng