http://jsbin.com/qobaguguro/edit?html,css,js,output
window.onload=function(){
var li=document.getElementsByTagName("li");
a=document.getElementsByClassName("a");
for(var i=0;i< a.length;a++){
console.log(a);
}
li.onclick=function(){
li.className="a"; //这个为什么没有反应?
}
};
<ul>
<li> 2</li>
<li class="a">4 </li>
<li>5 </li>
</ul>
必须用js
我想 a的部分 显示 ,其它li 不显示 通过css设置字体背景为白。
然后自己点击li给li添加a,其它a就删除。请问如何把我思路完整的写出来。
window.onload=function(){
var li=document.getElementsByTagName("li");
for(var j=0;j<li.length;j++){
li[j].onclick=function (){
for(var i=0;i<li.length;i++){
li[i].className='';
}
this.className='a';
}
}
};
getElementsByTagName()方法返回的是HTMLCollection类型。
HTMLCollection是包含了网页元素的通用集合,它本身并不含有onclick事件接口。
li.onclick=function(){}
这里仅仅是在li
中创建了一个叫做onclick
的属性,然后把一个匿名函数赋值给它而已。
要绑定onclick事件必须对某一个具体的DOM,绑定事件要放到循环体里面去
window.onload=function(){
var li=document.getElementsByTagName("li");
for(var i=0; i< li.length; i++){
li[i].onclick = function(){
for(var j=0; j< li.length; j++){
li[j].className="";
}
this.className="a";
};
}
};
楼主的这种得用闭包和循环修改样式来实现了
for(var s=0;s<li.length;s++){
(function (s){
li[s].onclick = function(){
for(var j=0;j<li.length;j++){
li[j].className="";
}
li[s].className="a";
})(s);
}
var li = document.getElementsByTagName('li');
for (var i = 0; i < li.length; i++) {
li[i].onclick = function() {
for (var j = 0; j < li.length; j++) {
li[j].className = '';
}
this.className = 'a';
}
}
li.each(function(){
this.onclick - function(){};
});
1.首先,你的for循环写错了,a++怎么可以,是i++;
2.其次,这是自定义属性的问题,因为在TagName取到的是一组标签名,它们的索引(下标)可以对应到i值,但是到点击事件中,循环已经结束所以i就变成了最大值,在这里添加一个自定义属性index,传递进事件中就可以了,跟闭包没什么关系。
for ( var i = 0 ; i < inputs.length; i++) {
inputs[i].index = i;
inputs[i].onclick = function () {
for ( var j = 0; j < sections.length; j++) {
sections[j].style.display = 'none';
sections[this.index].style.display = 'block';
}
}
}