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元素节点/ ...
随机推荐
- Git CMD - push: Update remote refs along with associated objects
命令格式 git push [--all | --mirror | --tags] [--follow-tags] [--atomic] [-n | --dry-run] [--receive-pac ...
- AjaxForm
近乎的Ajax控件介绍,代码下载:http://www.jinhusns.com/Products/Download?type=whp AjaxForm 概述 功能说明 基于 ajaxForm 插件进 ...
- .net中判断该应用程序是否已经启动,防止重复启动,监控程序启动是否正常
//获取配置文件中的需要监控项 private static string MonitorServe = ConfigurationSettings.AppSettings["Monitor ...
- SSIS_TXT有规则资料导入到EXCEL
SSIS开发需要完全安装sqlserver.本次demo是sqlserver2008. 1.创建项目 2.解决方案打开如图所示. 3.拉取一个序列容器,一个数据流任务. 4.在数据流任务点击.拉取一个 ...
- Chrome 控制台不完全指南【转载】
Chrome的开发者工具已经强大到没朋友的地步了,特别是其功能丰富界面友好的console,使用得当可以有如下功效: 更高「逼格」更快「开发调试」更强「进阶级的Frontender」 Bug无处遁形「 ...
- iOS开发——model类模板(过滤null和ID)
说明:model类模板已默认过滤null值,附加特殊情况的关键字ID名的冲突(需手动去掉注释代码).MyMessageModel为示例的名字.可以自己随便起. 1.自己创建一个继承与N ...
- OC9_文件操作
// // main.m // OC9_文件操作 // // Created by zhangxueming on 15/6/19. // Copyright (c) 2015年 zhangxuemi ...
- response.redirect和server.Transfer的差别详解
Response.Redirect和Server.Transfer都能实现页面的跳转,但两者又有很大区别. 一 地址栏里显示的地址不同 Response.Redirect会显示跳转的网页的地址,而Se ...
- [C#]线程处理
线程处理用于使程序能够执行并发处理,同时执行多个操作.C#中有三种线程的使用方法,BackgroundWorker组件.线程池.自己创建使用线程,接下来分别介绍如何使用. 1.使用Background ...
- ATL一:CWindowImpl
1,#ifdef _ATL_DISABLE_NO_VTABLE#define ATL_NO_VTABLE#else#define ATL_NO_VTABLE __declspec(novtable)# ...