1.需求
点击每个 li 节点, 都弹出其文本值
2.程序
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <script type="text/javascript"> 7 window.onload=function(){ 8 var liNodes=document.getElementsByTagName("li"); 9 for(var i=0;i<liNodes.length;i++){ 10 liNodes[i].onclick=function(){ 11 alert(this.firstChild.nodeValue); 12 } 13 } 14 } 15 </script> 16 </head> 17 <body> 18 <p>你喜欢哪个城市?</p> 19 <ul id="city"> 20 <li id="bj" name="BeiJing">北京</li> 21 <li>上海</li> 22 <li>东京</li> 23 <li>首尔</li> 24 </ul> 25 26 <br><br> 27 28 <p>你喜欢哪款单机游戏?</p> 29 <ul id="game"> 30 <li id="rl" name="hongjing">红警</li> 31 <li>实况</li> 32 <li>极品飞车</li> 33 <li>魔兽</li> 34 </ul> 35 </body> 36 </html>
3.效果
4.需求
点击每个 li 节点, 若 li 节点的文本值没有 ^^ 开头, 加上，有，则去除
5.程序
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Insert title here</title> 6 <script type="text/javascript"> 7 window.onload=function(){ 8 var liNodes=document.getElementsByTagName("li"); 9 for(var i=0;i<liNodes.length;i++){ 10 liNodes[i].onclick=function(){ 11 var liValue=this.firstChild.nodeValue; 12 var reg=/^^{2}/g; 13 if(reg.test(liValue)){ 14 liValue=liValue.replace(reg,""); 15 }else{ 16 liValue="^^"+liValue; 17 } 18 this.firstChild.nodeValue=liValue; 19 } 20 } 21 } 22 </script> 23 </head> 24 <body> 25 <p>你喜欢哪个城市?</p> 26 <ul id="city"> 27 <li id="bj" name="BeiJing">北京</li> 28 <li>上海</li> 29 <li>东京</li> 30 <li>首尔</li> 31 </ul> 32 33 <br><br> 34 35 <p>你喜欢哪款单机游戏?</p> 36 <ul id="game"> 37 <li id="rl" name="hongjing">红警</li> 38 <li>实况</li> 39 <li>极品飞车</li> 40 <li>魔兽</li> 41 </ul> 42 </body> 43 </html>
6.运行结果
