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还包含注释节点)

js获取节点的更多相关文章

  1. 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  2. JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)

    先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...

  3. JS获取节点的兄弟,父级,子级元素

    https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...

  4. JS获取节点方法

    1. 通过顶层document节点获取:(1) document.getElementById(elementId):该方法通过节点的ID,可以准确获得需要的元素,是比较简单快捷的方法.如果页面上含有 ...

  5. js获取节点和编辑的方法

    创建新节点 1.创建一个DOM片段createDocumentFragment() 例如: var d=document.createDocumentFragment(); d.appendChild ...

  6. js获取节点的DOM操作

    一直感觉DOM节点什么的乱七八糟的不能理解,可能博客也没办法写清楚,只能把知道的一些信息大致写下来慢慢再补充了. HTML DOM类型 Node类型 Javascript中的所有节点类型都继承自Nod ...

  7. 原生态js获取节点的方法

    <input value="我是用id来获取值的" type="button" onclick="GetById()"/> &l ...

  8. js 获取节点

    var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; //获得s的下一个 ...

  9. js:获取节点相关的 nodeName,nodeType,nodeValue

    getElementById() getElementsByName() getElementsByTagName() hasChildNodes() nodeName nodeType=1元素节点/ ...

随机推荐

  1. Nginx - HTTP Configuration, Module Directives

    Socket and Host Configuration This set of directives will allow you to configure your virtual hosts. ...

  2. Git CMD - merge: Join two or more development histories together

    命令格式 git merge [-n] [--stat] [--no-commit] [--squash] [--[no-]edit] [-s <strategy>] [-X <st ...

  3. 【SQLServer】使用T-SQL访问远程数据库:openrowset 和 openquery 以及连接服务器的创建

    █ 启用/关闭Ad Hoc Distributed QueriesAd Hoc Distributed Queries服务默认是关闭的,要使用openrowset 和 openquery访问远程数据库 ...

  4. datatable dateset 载体传递数据、存储过程

    第一部分:数据库通过存储过程读取数据,通过datatable接受,前台通过asp:repeater.DataSource()和binding()绑定数据 /// <summary> /// ...

  5. CodeSmith Template Model Output

    背景:上学那会儿就接触CodeSmith,是一款非常优秀的代码自动生成工具.以前写过好些基本模版,可惜早不知道扔到哪儿去了,如今只能重新开始,把它捡回来,加油. 效果:将数据库 DataBase 应用 ...

  6. 设置 MyEclipse 默认打开文件方式

         在web开发时,我们在打开JSP页面时,MyEclipse默认使用 Vistual 的方式打开.这种方式打开JSP页面时,很慢.在实际的开发过程中我们不想使用这种默认的方式打开JSP.设置如 ...

  7. js知识简单归纳

    js简单的归纳 基本类型 number,string,boolean,null,undefined 组合类型 一种对象类型: object 数组 函数 对象 正则 关于函数 作用域 闭包 构造函数 原 ...

  8. @Autowired与@Resource用法

    官方文档中有这样一段话. If you intend to express annotation-driven injection by name, do not primarily use @Aut ...

  9. 暑假集训(4)第七弹——— 组合(hdu1850)

    题意概括:你赢得了第一局.魔鬼给出的第二局是,如果有N堆牌,先手的人有几种可能胜利. 问题分析:尼姆游戏,先得到n堆牌的数量异或和,再将异或和与每一个牌组的数量异或,如果结果小于原牌组数量 则可能++ ...

  10. emacs_1

    --> 正在处理依赖关系 perl(VMS::Filespec),它被软件包 perl-PathTools-3.2701-1.el5.rf.x86_64 需要---> 软件包 perl-p ...