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还包含注释节点)
js获取节点的更多相关文章
- 原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较
一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...
- JS获取节点的兄弟,父级,子级元素的方法(js获取子级获取到换行与空格元素-FF)
先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 < ...
- JS获取节点的兄弟,父级,子级元素
https://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作 ...
- JS获取节点方法
1. 通过顶层document节点获取:(1) document.getElementById(elementId):该方法通过节点的ID,可以准确获得需要的元素,是比较简单快捷的方法.如果页面上含有 ...
- js获取节点和编辑的方法
创建新节点 1.创建一个DOM片段createDocumentFragment() 例如: var d=document.createDocumentFragment(); d.appendChild ...
- js获取节点的DOM操作
一直感觉DOM节点什么的乱七八糟的不能理解,可能博客也没办法写清楚,只能把知道的一些信息大致写下来慢慢再补充了. HTML DOM类型 Node类型 Javascript中的所有节点类型都继承自Nod ...
- 原生态js获取节点的方法
<input value="我是用id来获取值的" type="button" onclick="GetById()"/> &l ...
- js 获取节点
var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; //获得s的下一个 ...
- js:获取节点相关的 nodeName,nodeType,nodeValue
getElementById() getElementsByName() getElementsByTagName() hasChildNodes() nodeName nodeType=1元素节点/ ...
随机推荐
- Httpclient 和jsoup结和提取网页内容(某客学院视频链接)
最近在极客学院获得体验会员3个月,然后就去上面看了看,感觉课程讲的还不错.整好最近学习Android,然后去上面找点视频看看.发现只有使用RMB买的会员才能在上面下载视频.抱着试一试的态度,去看他的网 ...
- win7如何建立无线局域网
将win7电脑变身WiFi热点,让手机.笔记本共享上网用win7建立无线局域网,可以共享上网可以局域网游戏.开启windows 7的隐藏功能:虚拟WiFi和SoftAP(即虚拟无线AP),就可以让电脑 ...
- 深入理解Java虚拟机博客参考目录
参考博客:注明请注明出处 深入理解Java虚拟机读书笔记之:第5章 Java虚拟机(Java虚拟机内部结构图,很重要) 深入理解Java虚拟机读书笔记之:第6章 Java class文件: <深 ...
- asp.net发布webservice出现‘Could not write to output file ‘解决办法
Could not write to output file 'c:\Windows\Microsoft.NET\Framework\v4.0.30319\Temporary ASP.NET File ...
- java 调用bash shell脚本阻塞的小问题的解决
java 调用bash shell脚本阻塞的小问题的解决 背景 使用java实现的web端,web端相应用户的界面操作,使用java调用bash实现的shell脚本进行实际的操作,操作完成返回执行结 ...
- plsqldev与sqldeveloper
plsqldev连接 1.连接不同服务器,要修改tnsnames.ora文件,具体如下修改如下位置 # tnsnames.ora Network Configuration File: \app\us ...
- Cocos2d-x中Vector<T>容器以及实例介绍
Vector<T> 是Cocos2d-x 3.x推出的列表容器,因此它所能容纳的是Ref及子类所创建的对象指针,其中的T是模板,表示能够放入到容器中的类型,在Cocos2d-x 3.x中T ...
- 【转】Linux网络编程入门
(一)Linux网络编程--网络知识介绍 Linux网络编程--网络知识介绍客户端和服务端 网络程序和普通的程序有一个最大的区别是网络程序是由两个部分组成的--客户端和服务器端. 客户 ...
- Bitmap、CBitmap、HBITMAP以及BITMAP的相互转换
Bitmap.CBitmap.HBITMAP以及BITMAP的相互转换 构建CBitmapCBitmap bmp;bmp.LoadBitmap(ID); 构建HBITMAPHBitmap = (HBI ...
- POJ 3928 Ping pong
题目链接:http://poj.org/problem?id=3928 乒乓比赛,有N个人参加,输入每个玩家的技能等级,对每个人设置一个特定ID和一个技能值,一场比赛需要两个选手和一个裁判,只有当裁判 ...