Question

怎样能用JS更改DIV 的ID值

例：<div id='2'></div>
经鼠标事件后或者一段时间后ID值进行改变

Answer 1

先获取这个元素：

var a=document.getElementById("2");

然后写一个触发事件，比如onclick

然后改变这个元素的ID属性值：

a.setAttribute("id", "abc");

连起来就是：

<div id="2" onclick="ceshi();">点击测试</div>
<script type="text/javascript">
function ceshi(){
    var a=document.getElementById("2");
    a.setAttribute("id", "abc");
}
</script>

然后你在查看源文件看看这个DIV的ID就变成abc了~

追问

没变啊，效果还是一闪而过啊？查看页面源码也没变啊

追答

不可能啊~我试的时候没问题的啊！我把网页传给你你看看！

追问

是没变化啊。。

追答

你用的IE测试的吧~IE不兼容setAttribute这个属性~建议使用JQ写~

Answer 2

var _now = new Date().getTime();
var _interval = 0;
var timer = setInterval(function(){
var now = new Date().getTime();

_interval = now - _now;

if(_interval == 5000) {
document.querySelector('#2').id = 'special_2';

clearInterval(timer);

}

},1000);

追问

document.querySelector('#2').id = 'special_2';
这个方法改变id后为什么我在id中设置的样式一闪而过呢？怎么能让样式一直停留啊

追答

document.querySelector('#2').style['color']='red';

追问

不行啊。。

我想做的是这样的效果，当选中这个选项的时候这个选项为深色，样式都写在css中了，通过id来控制的；就是想当选中那一项时就把那一项的id指向这个css文件，要怎么做啊？你上面的方法都是一闪而过啊。。

追答

#special_2 {color:red}
test

function change (obj) {
obj.id = obj.id == '2' ? 'special_2' : '2';
}

ffffffffffff

追问

这个只是鼠标放上去是变了，我想点击之后就一直保留红色啊

追答

#special_2 {color:red}
test

function change (obj) {
obj.id = 'special_2';
}

ffffffffffff

Answer 3

用class不行吗

Answer 4

这个10分多难拿啊！
一定要改变id么？id就跟身份证号码一样，要改得多麻烦啊！