JS dom節點

時間 2019-12-06

原文原文鏈接

1.DOM操做內容

1.innerText屬性javascript

document.getElementById("box").innerText;  //獲取文本內容（若有html直接過濾掉）
document.getElementById("box").innerText="Mr.Lee"; //設置文本（若有html轉義）

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
   </head>
   <body>

       <div id="t1" class="c1" >


           <span>
               span1111111
           </span>

           <p>2222222</p>

       </div>

       <input type="button" id="btn" value="點擊" />
   </body>
</html>
<script type="text/javascript">
   //1:元素節點 2：屬性 3：文本
   //兩個元素之間若是沒有文本就有一個空白
   var t1=document.getElementById('t1');
   var span=t1.getElementsByTagName('span');
   //alert(t1.childNodes[0].nodeValue.match(/^\s+$/))

   function glkg(nodes){
       var arr=[];
       var reg=/^\s+$/;
       for (var i = 0; i < nodes.length; i++) {
           if(nodes[i].nodeType==3&&reg.test(nodes[i].nodeValue)){
               continue;
           }
           arr.push(nodes[i])

       }
       return arr;
   }

   var nodes=glkg(t1.childNodes)
   //alert(nodes[0].innerText)
   var n1=nodes[0].cloneNode(true);
   //插入節點子節點兄弟節點
   var span1=document.createElement('span');
   var text=document.createTextNode('span22222');
   span1.appendChild(text);

   //t1.appendChild(span1)//添加子節點
   //t1.insertBefore(span1,span[0])//添加兄弟節點
   //alert(span[0].nextSibling)
   function inafter(fu,newnode,n){
       return fu.insertBefore(newnode,n.nextSibling);

   }

   inafter(t1,n1,span[0]);
</script>html

http://www.baoqianduan.com/demo/nav/java

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。