JavaScript之获取节点
JavaScriopt DOM有三大节点:元素节点、属性节点、文本节点。
其中获取元素节点的三种主要方法有:
1.document.getElementById();此方法根据节点的唯一id值获取节点。
如<li id = "hamigua">哈密瓜</li>,document.getElementById("hamigua");
2.document.getElementByTagName();此方法根据节点的标签名获取节点。
如<li></li>标签,document.getElementByTagName("li");
3.document.getElementsByName();此方法根据节点的name属性获取节点。
如<input type = "text" name = "n_hamigua" value = "哈密瓜"/>,document.getElementsByName("n_hamigua");
但是这个方法只能获取有name属性的节点,如<li name = "li_hamigua"></li>,document.getElementsByName(li_hamigua);是获取不到的,使用时应注意这个问题。
而属性节点和文本节点都是需要先获取到元素节点之后,再获取。
属性节点:<input type = "text" id = "input_hamihua" value = "value_hamigua"/>;document.getElementById("input_hamigua").getAttributeNode("value");
这样才可以获取到input标签的value属性, 即获取到"value_hamigua"这个属性值。
文本节点:<li id = "li_hamigua">哈密瓜</li>;document.getElementById("li_hamigua").firstChild;
这样才可以获取到input标签的文本节点,即获取到"哈密瓜"这个文本值。
在这里解释一下三个节点的区别:
①元素节点:类似于<body></body>、<li></li>、<input/>这样的节点。
②属性节点:类似于<input type="text" name="text"/>中的"name='text'"这样的节点。
③文本节点:类似于<li>HelloWorld</li>中的"HelloWorld"这样的节点。
JavaScript之获取节点的更多相关文章
- 【转】JavaScript获取节点类型、节点名称和节点值
DOM节点信息包括节点类型(nodeType).节点名称(nodeName)和节点值(nodeValue). 节点类型 DOM节点中,每个节点都拥有不同的类型.W3C规范中常用的 DOM节点类型有以下 ...
- 总结获取原生JS(javascript)的父节点、子节点、兄弟节点
关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...
- JavaScript -- 练习,Dom 获取节点
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- document获取节点byId&byName
<script type="text/javascript"> /* *需要:获取页面中的DIV节点: *思路: *通过docment对象完成.因为div节点有ID属性 ...
- 封装常用的js(Base.js)——【01】理解库,获取节点,连缀,
封装常用的js(Base.js)——[01]理解库,获取节点,连缀, youjobit07 2014-10-10 15:32:59 前言: 现如今有太多优秀的开源javascript库, ...
- javascript中获取非行间样式的方法
我们都知道一般在javascript中获取样式一般用的是nodeObj.style.attr这个属性的,但是这个属性只能获取行间样式非行间样式比如写在样式表中的样式那么用nodeObj.style.a ...
- JS获取节点方法
1. 通过顶层document节点获取:(1) document.getElementById(elementId):该方法通过节点的ID,可以准确获得需要的元素,是比较简单快捷的方法.如果页面上含有 ...
- js dom操作获取节点的一些方法
在复习javascript基础的时候,整理了一下js中获取节点的一些常用的方法,见代码: //js获取下一个兄弟节点 function getNextSibling(eleObj){ var next ...
- JavaScript快速查找节点
我们在实际的开发中,经常要获取页面中某个html元素,动态更新元素的样式.内容属性等. 我们已经知道在JavaScript中提供下面的方法获取子.父.兄节点的方法: 常规 通过父节点获取子节点: pa ...
随机推荐
- English - Titanium Bike
The silver-gold triathlon bike was sitting in Kris's dining room next to the door. It had no kicksta ...
- java基础之集合框架(1)
一.介绍Collection 1.概念:Collection是最基本的集合接口,一个Collection代表一组Object,即Collection的元素(Elements).一些Collection ...
- jQuery教程详解(一)
PS--了解JQuery Query是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库( 或JavaScript框架).jQuery设计的宗旨 ...
- CJOJ 2482 【POI2000】促销活动
CJOJ 2482 [POI2000]促销活动(STL优先队列,大根堆,小根堆) Description 促销活动遵守以下规则: 一个消费者 -- 想参加促销活动的消费者,在账单下记下他自己所付的费用 ...
- nyoj_61: 传纸条(一)
题目链接 使用双线dp,假设两个人同时从左上角移动到右下角,且满足路线不交叉,另k=x1+y1=x2+y2压缩状态进行优化.每次状态转移满足 x1,x2,y1,y2都在矩阵范围内,且(x2,y2)在相 ...
- windows环境下,anoconnda安装tensorflow
最近对深度学习研究比较多,目前最火的Python深度学习库应该是tensorflow了. 为了方便,本人在windows下用anaconda来使用python,且同时安装了,anaconda2,3,3 ...
- filezilla里怎么解决中文乱码问题
使用Filezilla client FTP客户端登陆某些FTP站点会出现中文乱码,原因是FTP服务器端编码与filezilla client端编码不一致造成的.解决方法如下:文件-站点管理-选中要登 ...
- informatica 学习总结
问:什么是BI? 答:BI是商务智能,它包含的应用系统和技术较宽泛,通过收集,存储,分析和提供对数据的访问,来帮助企业用户做出更好的商务决策. BI应用包括决策支持,查询和报表,联机分析处理OLAP, ...
- (转)XML中必须进行转义的字符
场景:在工作中接触到很多xml文件,为了更好的操作这些文件,所有很有必要熟知xml文件的相关语义. 1 引入 编写XML代码经常遗漏的常识: XML实体中不允许出现"&", ...
- Spring源码情操陶冶-AbstractApplicationContext#initApplicationEventMulticaster
承接前文Spring源码情操陶冶-AbstractApplicationContext#initMessageSource 约定web.xml配置的contextClass为默认值XmlWebAppl ...