day01-运算符
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> /* var i = 0; i++; if( i === 5 ){ i = 0; } i%=5; */ window.onload = function (){ var aLi = document.getElementsByTagName('li'); var arr = [ 'red', 'yellow', 'blue' ]; for( var i=0; i<aLi.length; i++ ){ aLi[i].index = i; aLi[i].style.background = arr[i%arr.length]; aLi[i].onmouseover = function (){ this.style.background = 'gray'; }; aLi[i].onmouseout = function (){ this.style.background = arr[this.index%arr.length]; }; } }; </script> <style> li { height:24px; margin-bottom:3px; list-style:none; } </style> </head> <body> <ul id="ul1"> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </body> </html>
移入哪一行哪一行变灰色
反选
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function (){ var aInp = document.getElementsByTagName('input'); // aInp[1].checked = false; // aInp[2].checked = true; aInp[0].onclick = function (){ for( var i=1; i<aInp.length; i++ ){ aInp[i].checked = !aInp[i].checked; /* if( aInp[i].checked ) { aInp[i].checked = false; } else { aInp[i].checked = true; } */ } }; }; </script> </head> <body> <input type="button" value="反选" /> <ul> <li><input type="checkbox" checked /></li> <li><input type="checkbox" /></li> <li><input type="checkbox" checked /></li> <li><input type="checkbox" /></li> <li><input type="checkbox" /></li> </ul> </body> </html>