Javascript 如何添加或删除html5的音频属性<；音频>；？

我用html5和javascript创建了一个多音轨播放器

var track_1 = document.getElementById('audio_1');

我制作了自定义控制按钮：音量、播放、停止、暂停，例如：

$bt_play_audio_mixette_1.click(function() {
    if (track_1.paused == false) {
        track_1.pause();
    } else {
        track_1.play();
    }
});

我有一个“循环”按钮，我想动态修改为

属性

循环

我试过使用
.attr（）
或
.prop（）但没有成功

您是否知道此代码中的错误：

var loop_1_active = true;
$bt_loop_audio_1.click(function() {
    if (track_1.prop("autoplay", true)) {
        track_1.prop("autoplay", false);
        loop_1_active = false;
    } else {
        track_1.prop('loop', true)
        track_1.attr("autoplay", true);
    }
});

编辑：

如果使用jquery对象：

var track_1_B = $('#audio_1');

我不能使用
pause（）

错误：引用错误：未定义轨迹_1。暂停（）

如果我使用纯JS：

var track_1 = document.getElementById('audio_1'); 

我可以使用
pause（）
但是如果（track_1.prop（“autoplay”，true））{
实际将autoplay属性设置为true，而不是检查它是否为true，并且总是返回一个truthy值，我无法更改循环属性。请改用
如果（track_1.prop（“autoplay”））{
。我现在看到
track\u 1
是一个dom元素，而不是一个jQuery对象，因此需要将它转换为一个使用
prop（）
…例如
$（track\u 1）.prop（“autoplay”）
。您也可以直接访问元素属性，无需使用jQuery

var track_1 = document.getElementById('audio_1');
var loop_1_active = true;
$bt_loop_audio_1.click(function() {
    if (track_1.autoplay) {
        track_1.autoplay = false;
        loop_1_active = false;
    } else {
        track_1.loop = true;
        track_1.autoplay = true;
    }
});

if（track_1.prop（“autoplay”，true））{
实际上将autoplay属性设置为true，而不是检查它是否为true，并且将始终返回真实值。请改用
if（track_1.prop（“autoplay”））{
。我现在看到
track\u 1
是一个dom元素，而不是一个jQuery对象，因此需要将它转换为一个使用
prop（）
…例如
$（track\u 1）.prop（“autoplay”）
。您也可以直接访问元素属性，无需使用jQuery

var track_1 = document.getElementById('audio_1');
var loop_1_active = true;
$bt_loop_audio_1.click(function() {
    if (track_1.autoplay) {
        track_1.autoplay = false;
        loop_1_active = false;
    } else {
        track_1.loop = true;
        track_1.autoplay = true;
    }
});

也可以使用jquery：

var $track_1 = $('#audio_1'); // jquery object
var track_1 = document.getElementById('audio_1'); // pure js DOM element

并且只在jquery对象上使用jquery方法

$track1.click(//...
$track1.attr(//...
$track1.prop(//...

DOM元素上的其他方法

trakck1.pause();

也可以使用jquery：

var $track_1 = $('#audio_1'); // jquery object
var track_1 = document.getElementById('audio_1'); // pure js DOM element

并且只在jquery对象上使用jquery方法

$track1.click(//...
$track1.attr(//...
$track1.prop(//...

DOM元素上的其他方法

trakck1.pause();

您确定
track_1
是jquery的一个实例（以这种方式初始化：
var track_1=$（\u audio\u元素”）
）吗？您应该在track_1所在的位置添加一段代码initialized@freedev我已经用init代码更新了这个问题。@Szymkowski我已经用init代码更新了这个问题。@Peter Szymkowski“你说的是什么意思？”所以这是一个问题“？您确定
track\u 1
是jquery的一个实例（以这种方式初始化：
var track\u 1=$（#音频元素”）
）？您应该在轨道1所在的位置添加一段代码initialized@freedev我用init代码更新了问题。@Szymkowski我用init代码更新了问题。@Peter Szymkowski你说的“这是个问题”是什么意思？我总是阅读文章，实际上我只有一个错误：ReferenceError:如果（track_1.prop）自动播放未定义（自动播放，正确）{@SébastienGicquel我不知道你在使用什么浏览器/调试工具，但是我的控制台显示了一个错误
track_1.attr不是一个函数
是的，并且这个消息告诉你在so
attr
函数中，所以
track_1
不是jquery的实例。我不明白为什么如果我使用jquery对象，我不能使用pause（）；error:ReferenceError:track_1未定义track_1.pause（）；如果我使用纯JS var track_1=document.getElementById（'audio_1'），我可以使用pause（）；但我无法更改循环属性我始终读取循环，实际上我只有一个错误：ReferenceError:autoplay未定义If（track_1.prop（autoplay，true））{@SébastienGicquel我不知道你在使用什么浏览器/调试工具，但是我的控制台显示了一个错误
track_1.attr不是一个函数
是的，并且这个消息告诉你在so
attr
函数中，所以
track_1
不是jquery的实例。我不明白为什么如果我使用jquery对象，我不能使用pause（）；error:ReferenceError:track_1未定义track_1.pause（）；如果我使用纯JS var track_1=document.getElementById（'audio_1'），我可以使用pause（）；但我无法更改循环属性此代码工作正常。但是，我注意到有时chrome和循环属性存在错误。我在google上看到了很多关于此错误的主题，所以这不是你的代码，这是chrome错误。此代码工作正常。然而，我有时注意到chrome和循环属性存在错误。我看到了很多主题关于谷歌上的这个bug，所以这不是你的代码，这是一个Chrome bug。