zoukankan      html  css  js  c++  java
  • JavaScript 获取点击事件(两个小例子)

    点击每个li节点,都弹出其文本值

     1 <title>Insert title here</title>
     2    
     3      <script type="text/javascript">
     4           
     5             //点击每个li节点,都弹出其文本值
     6             
     7             //1.获取所有的li节点
     8             window.onload = function(){
     9                 var liNodes = document.getElementsByTagName("li");
    10                 //2.实用for循环进行遍历,获取每一个li节点
    11                 for(var i=0;i<liNodes.length;i++){
    12                     //4.在响应函数中获取当前文本节点的文本值
    13                     liNodes[i].onclick = function(){
    14                         //5.alert打印
    15                         alert(this.firstChild.nodeValue);
    16                     }
    17                 }
    18             }
    19      
    20      </script>
    21 
    22 </head>
    23 <body>
    24       <p>你喜欢哪个城市</p>
    25       <ul id="city">
    26            <li id="bj" name="BeiJing">北京</li>
    27            <li>上海</li>
    28            <li>东京</li>
    29            <li>首尔</li>
    30       </ul>
    31 
    32 
    33 </body>

    点击每个li节点,若li节点的文本值没有^^开头,加上;有,去除

     1 <title>Insert title here</title>
     2 
     3   <script type="text/javascript">
     4           
     5             //点击每个li节点,若li节点的文本值没有^^开头,加上;有,去除
     6             
     7             //1.获取所有的li节点
     8             window.onload = function(){
     9                 var liNodes = document.getElementsByTagName("li");
    10                 //2.实用for循环进行遍历,获取每一个li节点
    11                 for(var i=0;i<liNodes.length;i++){
    12                     //4.在响应函数中获取当前文本节点的文本值
    13                     liNodes[i].onclick = function(){
    14                         var val=this.firstChild.nodeValue;
    15                         //正则表达式
    16                         var reg = /^^{2}/g;
    17                         if(reg.test(val)){
    18                             val = val.replace(reg,"");
    19                         }else{
    20                             val = "^^" + val;
    21                         }
    22                         this.firstChild.nodeValue = val;
    23                     }
    24                 }
    25             }
    26      
    27      </script>
    28 </head>
    29 <body>
    30 
    31       <p>你喜欢哪个城市</p>
    32       <ul id="city">
    33            <li id="bj" name="BeiJing">北京</li>
    34            <li>上海</li>
    35            <li>东京</li>
    36            <li>首尔</li>
    37       </ul>
    38 
    39 </body>
  • 相关阅读:
    C++复制构造函数,类型转换构造函数,析构函数,引用,指针常量和常量指针
    POJ1611(The Suspects)--简单并查集
    最小生成树-Kruskal算法
    POJ1861(Network)-Kruskal
    POJ1979(Red and Black)--FloodFill
    [转]全网最!详!细!tarjan算法讲解
    POJ1573(Robot Motion)--简单模拟+简单dfs
    最小生成树-Prim算法
    POJ3368(Frequent values)--线段树
    POJ3255(Roadblocks)--次短路径
  • 原文地址:https://www.cnblogs.com/Codinginging/p/10753617.html
Copyright © 2011-2022 走看看