Question

js 动态添加id

<ul>
<li><a id="tage">首页</a></li>
<li><a>第二页</a></li>
<li><a>第三</a></li>
<li><a>第四页</a></li>
</ul>
如何使用js动态改变id,如点击第二页 ,id="tage"换到第二页的a标签
<ul>
<li><a >首页</a></li>
<li><a id="tage">第二页</a></li>
<li><a>第三</a></li>
<li><a>第四页</a></li>
</ul>

Answer 1

你是为了改变样式还是其他的作用？改变id，可能导致其他读取错误

如果你是单个玩，就可以这样写了

改变样式class就可以了

不过你的就是这样的：

<ul>
    <li><a id="tage">首页</a></li>
    <li><a>第二页</a></li>
    <li><a>第三</a></li>
    <li><a>第四页</a></li>
</ul>
<script>
var lis = document.getElementsByTagName("li");
var last = 0;
lis[last].id = "tage";
for(var i = 0; i < lis.length; i++){
    (function(i){
        lis[i].onclick = function(){
            lis[last].removeAttribute("id");
            this.id = "tage";
            last = i;
        }
    })(i);
}
</script>

Answer 2

var li = document.getElementsByTagName('li');
	var id = 'tage';
	for(var i =0; i< li.length;i ++){
		li[i].onclick = function (){
			for(var i =0; i< li.length; i++){
				li[i].getElementsByTagName('a')[0].id='';
			}
			this.getElementsByTagName('a')[0].id = id;
		}
	}