zoukankan      html  css  js  c++  java
  • js获取节点

      demo1:

    <!-- <div id="test" v="1">你好</div> -->
    
    // console.log(test.nodeType,test.getAttribute("v"),test.nodeName,test.firstChild.nodeValue);
    //firstChild.nodeValue是第一个节点的value的值

     

     demo2:

    <ul id="test2">
    	<li>1</li>
    	<li>2</li>
    	<li>3</li>
    </ul>
    
    方法一 :for(var i = 0,len = test2.childNodes.length;i<len;i++){
    
    		console.log(test2.children[i].firstChild.nodeValue);//children[i]
    }
    
    
    
    方法而:for(var i = 0,len = test2.childNodes.length;i<len;i++){
    
    		if(test2.childNodes[i].nodeType == 1){ //test2.childNodes[i].nodeType == 1都是文本节点 不是回车节点
    
    				console.log(test2.childNodes[i].firstChild.nodeValue);
    		}
    
    		
    }
    

     demo3:

    var ele = document.createElement("li");//创建一个li
    
    // test2.insertBefore(ele,test2.firstChild);//ele是创建的节点li,test2.firstChild是插入test2的第一个节点(把ele插入test2的第一个节点)
    
    // test2.insertBefore(ele,test2.lastChild);//ele是创建的节点,test2.firstChild是插入test2的最后一个个节点

    // var test3 = test2.replaceChild(ele,test2.children[0]);//ele是创建的节点,test2.children[0]是替换test2的第一个节点

    console.log(test3);//有返回值,返回值为被替换的值
    ele.innerHTML = "<strong>00</strong>"//什么都不加就是空标签 ele.onclick = function(){ console.log(this.firstChild.firstChild.nodeValue); }
    console.log(test2.parentNode.nodeName)// 父节点的节点名称
    

     childNodes和children的区别是 children属性做包含的文本节点,其它都差不多(ie9以上可用,ie8还包含注释节点)

  • 相关阅读:
    Pascal's Triangle 2(leetcode java)
    118. Pascal's Triangle (java)
    Bulb Switcher (leetcode java)
    Lowest Common Ancestor of a Binary Search Tree(Java 递归与非递归)
    Remove Duplicate Letters(Java 递归与非递归)
    读大道至简有感
    自学Java第一周的总结
    jmeter----jpgc----ultimate thread group
    jmeter----jpgc----stepping thread group
    jmter--jpgc模块
  • 原文地址:https://www.cnblogs.com/xupeiyu/p/4677635.html
Copyright © 2011-2022 走看看