<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>选择集</title>
<script>
window.onload = function(){
// aList = document.getElementsByTagName('list1');
// 这里使用TagName寻找元素, 不用使用id名, 也不用使用class名, 只需要输入table标签名即可.
aList = document.getElementsByTagName('li');
aList02 = document.getElementById('list02')
aLi02 = aList02.getElementsByTagName('li');
// 此方法读取的是html内所有同名标签, 需要针对某类标签使用的时候, 需要对父集元素设置id, 先byId获取父集, 然后在父集内byTab
var ilen=aList.length;
// alert(aList);
// alert(aList.length); 直接通过TagName获取的元素, 并不是数组, 也不是元素, 而是 !!选择集!!.
aList[4].style.backgroundColor = 'red';
// 选择集只能通过下标使用, 不能同时设置多个, 所以想要全部设置需要用for 循环.
for(i=0;i<ilen;i++){
aList[i].style.backgroundColor = 'cyan';
if(0==i%2){
aList[i].style.backgroundColor = 'red';
}
}
var iLen02=aLi02.length;
alert(iLen02);
for(i=0;i<iLen02;i++){
aLi02[i].style.backgroundColor = 'plum';
if(0==i%2){
aLi02[i].style.backgroundColor = 'violet';
}
}
}
</script>
</head>
<body>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
</ul>
<ul id="list02">
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
</ul>
</body>
</html>
浙公网安备 33010602011771号