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 ...
随机推荐
- 数据结构3——浅谈zkw线段树
线段树是所有数据结构中,最常用的之一.线段树的功能多样,既可以代替树状数组完成"区间和"查询,也可以完成一些所谓"动态RMQ"(可修改的区间最值问题)的操作.其 ...
- Arcgis Engine axMapControl1.get_layer(index)中index意义
像 ILayer pLayer = this.axMapControl1.get_Layer(0); 意思是获取axMapControl1中的第一个图层,复制给pLayer.
- 如何快速轻松学习bootstrap
我以前也是通过看一些视频教程来学的,比如慕课网上的,比如51cto上的那些零基础入门bootstrap什么的,还有一些培训班里流传出来的,感觉晕乎乎的,不知所云. 还是在后面不断使用的过程中慢慢体会到 ...
- Docker与KVM之间的区别
一.Docker简介 Docker 项目的目标是实现轻量级的操作系统虚拟化解决方案. Docker 的基础是 Linux 容器(LXC)等技术. 在 LXC 的基础上 Docker 进行了进一步的封装 ...
- PM2源码浅析
PM2工作原理 最近在玩一个游戏,<地平线:黎明时分>,最终Boss是一名叫黑底斯的人,所谓为人,也许不对,黑底斯是一段强大的毁灭进程,破坏了盖娅主进程,从而引发的整个大陆机械兽劣化故事. ...
- JavaScript中Function原型及其prototype属性的简单应用
大家都知道在JavaScript中是没有类的概念的,但是却是有对象的概念的.有的人可能理解对象和类有些迷糊,这里简单的概括一下他们之间的区别: 类:抽象的概念,例如人,动物,汽车等都可以抽象成一个类 ...
- Linux，activemq-cpp之消息过滤器
假设过滤器字符串如下: filt1=aaaa filt2=bbbb filt3=cccc activeMQ-cpp中消息过滤器,在发送消息的producer.cpp中,对message进行属性设置,m ...
- (转) Eclipse Maven 编译错误 Dynamic Web Module 3.1 requires Java 1.7 or newer 解决方案
场景:在导入Maven项目时候遇到如下错误. 1 问题描述及解决 Eclipse Maven 开发一个 jee 项目时,编译时遇到以下错误:Description Resource Path Loca ...
- swift3.0 CoreGraphics绘图-实现画板
swift3.0对绘图的API进行了优化,看起来更swift了. 看下UI的构造.设置画笔粗细.清空面板和保存到本地 下面直接看画板文件 这里我做的比较复杂,记录触摸到的每个点,再连成路径,其实直接用 ...
- swift 3.0 基础练习 面向对象 类
模拟需求 创建100个女朋友 1.用面向对象思想 2.名字随机 3.年龄随机 4.拥有约会功能 5.将所有女朋友信息输出 class GirlFirend: NSObject { var name:S ...