⽤JQuery或JS改变div的id的五种⽅法
div的id是可以改变的，通常使⽤的⽅法是通过JQuery或Javascript来实现。本⽂介绍⽤JQuery或JS改变div的id的五种⽅法。
⽅法⼀：使⽤Tag选择器
JQuery代码如下：
<div id="myDivId">测试</div>
<script type="text/javascript">
$('div').attr('id','myDivId_new');
</script>
Javascript代码如下：
<div id="myDivId">测试</div>
<script type="text/javascript">
</script>
jquery的attr属性
代码解释：上⾯的代码是把div的id名称由原来的“myDivId”改为“myDivId_new”。
注意问题：这个⽅法有很⼤的局限性，只当⽹页只有⼀个div标签时才正确，⽽绝⼤多数⽹页是不⽌⼀个div标签。
⽅法⼆：通过Class选择器
JQuery代码如下：
<div id="myDivId" class="myDivClass">测试</div>
<script type="text/javascript">
$('.myDivClass').attr('id','myDivId_new');
</script>
代码解释：上⾯的代码是把class为“myDivClass”的div的id名称由原来的“myDivId”改为“myDivId_new”。
注意问题：这个⽅法也有较⼤的局限性，只当⽹页只有⼀个div的class为“myDivClass”时才正确，⽽⽹页通常⼀个class有多个div在使⽤。⽅法三：通过id选择器（推荐）
JQuery代码：
<div id="myDivId" class="myDivClass">测试</div>
<script type="text/javascript">
$('#myDivId').attr('id', 'myDivId_new');
</script>
Javascript代码：
<div id="myDivId" class="myDivClass">测试</div>
<script type="text/javascript">
</script>
代码解释：上⾯的代码是把id为“myDivId”的div的id名称由原来的“myDivId”改为“myDivId_new”。
这个⽅法最好，因为它不受任何限制，即是不受⽹页的div数量限制，也不管⽹页有多少个div具有相同的class名称。
这是推荐⼤家使⽤的⼀个⽅法。
⽅法四：使⽤setAttribute
不单单是id，我们还可以改变div的class，或更多事件，或其他属性。
这⾥要⽤到setAttribute。
⽅法五：使⽤querySelector
还可以⽤querySelector()来改变div的id，代码如下：
document.querySelector("#divId").id = "newId";
注意：querySelector()⽅法仅仅返回匹配指定css选择器的第⼀个元素。例如：获取⽂档中第⼀个 <p> 元素：
document.querySelector("p");
获取⽂档中 class="example" 的第⼀个 <p> 元素：
document.querySelector("p.example");
获取⽂档中有 "target" 属性的第⼀个 <a> 元素：
document.querySelector("a[target]");
所以这个⽅法的局限性⾮常⼤。这⾥仅作介绍，但不作推荐使⽤。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。