javascript_basic_04之节点、元素
1、DOM:文档对象模型,Document Object Model;
2、BOM:浏览器对象模型,Browser Object Model;
3、DOM组成:核心DOM,XML DOM,HTML DOM;
4、节点树:
①document node:文档节点,document为根节点;②element node:元素节点;③attribute node:属性节点;④text node:文本节点;⑤comment node:注释节点;
5、选取元素:
①通过ID选取页面元素:document.getElementById(“id名”);②通过标签名选取页面元素:element.getElementByTagName(“标签名”);③通过元素class属性获取元素:element.getElementByClassName(“class属性名”);



6、通过节点关系获取元素:
①parentNode:当前元素父节点元素;②childNodes:当前元素所有子节点元素(数组);③firstChild:当前元素第一个子元素;④lastChild:当前元素最后一个子元素;⑤previousSibling:当前元素上一个兄弟节点元素;⑥nextSibling:当前元素下一个兄弟节点元素;




7、通过元素关系获取节点:
①children:当前元素的所有子级节点;②firstElementChild:当前元素第一个子级节点;③lastElementChild:当前元素最后一个子级节点;④previousElementSibling:当前元素前一个兄弟节点;⑤nextElementSibling:当前元素后一个兄弟节点;


8、元素文本的获取设置:
①innerHTML:获取设置元素的html内容;②textContent:获取设置元素的文本内容;
9、读取元素属性:
①elem.attributes【下标】.value;②elem.attributes【“属性名”】.value;③elem.getAttributeNode(“属性名”).value;④elem.getAttribute(“属性名”);


10、修改元素属性:
①elem.setAttribute(name,value);②elem.setAttributeNode(attrNode);


11、元素内联样式:
①获取:elem.style.属性名;②设置:elem.style.属性名=“值”;
12、获取元素内外部样式:
①DOM:document.defaultView.getComputedStyle(元素对象).style;②IE:元素对象.currentStyle.属性;
13、设置修改内外部样式值:
步骤①:获得包含属性的样式表对象:var sheet=document.styleSheets【下标】;步骤②:获取样式规则集合:var rules=sheet.rules;步骤③:获取目标样式规则:var rule=rules【下标】;步骤④:rule.style.属性名;


javascript_basic_04之节点、元素的更多相关文章
- JavaScript获取HTML DOM节点元素详解(转)
在Web运用程序特别是Web 2.0程序开发中,经常要获取页面中某个元素,然后更新该元素的样式.内容等.如何获取要更新的元素,是首先要处理的疑问. 51CTO推荐阅读:JavaScript DOM文档 ...
- [google面试CTCI] 2-2 找出链表的倒数第n个节点元素
[链表] Q:Implement an algorithm to find the nth to last element of a singly linked list . 题目:找出链表的倒数第 ...
- js获取HTML DOM节点元素方法总结
1. 通过顶层document节点获取: (1)document.getElementById(elementId) :通过ID获得节点,如果页面上含有多个相同id的节点,那么只返回第一个节点. ...
- 用XPath精确定位节点元素&selenium使用Xpath定位之完整篇
在利用XSL进行转换的过程中,匹配的概念非常重要.在模板声明语句 xsl:template match = ""和模板应用语句xsl:apply-templates select ...
- javascript总结34 :DOM之节点元素获取
常用节点元素获取: 1. 获取 html -- > document.documentElement 2. 获取 body -- > document.body 3. 获取指定的元素 -- ...
- angularjs中向html页面添加内容节点元素代码段的两种方法
第一种方式:原生JS向html页面添加内容节点元素代码段: <!DOCTYPE html> <html> <head> <meta charset=" ...
- Mybatis框架-update节点元素的使用
今天我们学习一下mybatis框架中的update节点元素的使用 需求:修改用户表中的一条数据记录,修改编号为21的用户的密码 UserMapper.xml UserMapper.java 编写测试方 ...
- layer 父弹窗获取子弹窗内的dom节点元素和变量
1 var body = layer.getChildFrame('body', index); //获取子弹窗的dom节点 2 3 var iframeWin = window[layero.fin ...
- XPath常用定位节点元素语句总结
将一个XML或HTML文档转换成了DOM树结构后,如何才能定位到特定的节点?XPath实现了这样的功能,它通过DOM树中节点的路径和属性来导航,通过XPath路径表达式可以选择DOM树中的nodes( ...
随机推荐
- React Native填坑之旅--Navigation篇
React Native的导航有两种,一种是iOS和Android通用的叫做Navigator,一种是支持iOS的叫做NavigatorIOS.我们这里只讨论通用的Navigator.会了Naviga ...
- C# 图片压缩
/// <summary> /// 图片压缩方法 /// </summary> /// <param name="sF ...
- selenium 富文本框处理
selenium 富文本框处理, 网上有用API的解决方法1:参见:http://blog.csdn.net/xc5683/article/details/8963621 群里1位群友的解决方法2:参 ...
- NSString格式校验
在项目开发过程中,NSString类型的变量是经常用到的,而且我们常常会对其格式进行对应的各种校验,你比如,在登录注册的时候,需要验证用户名的长度,用户名的字符组成等等,其实现在也有很多第三方提供的N ...
- caffe在windows 下的配置及matlab接口编译(无GPU)
本人机子windows 10,matlab2015a,vs2013(官网使用的是vs2013) 1.首先去github上下载caffe的windows包,地址:https://github.com/B ...
- ABP框架详解(三)Domain
此处的Domain主要指Abp类库根目录下Domain文件夹.顾名思义该目录下是用来存放与领域实体,领域逻辑执行,存储,领域服务相关的内容. 1.Entities (1)为整个Abp框架后期开发的所有 ...
- android更换工具链
欢迎转载opendevkit文章, 文章原始地址: http://www.opendevkit.com/?e=73 android编译系统是跟随android源码一起发布的,使用了gcc编译器,也就是 ...
- Asp.net MVC4 与 Web Form 并存
Web Forms 与 MVC 的asp.net 基础架构是相同的.MVC 的路由机制并不只MVC 特有的,它与WebForm 也是共享相同的路由机制.Web Forms 的Http请求针 ...
- Node.js系列之node.js初探
官方介绍:Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable n ...
- Ubuntu 下安装Mysql 需要注意的地方.
安装卸载 sudo apt-get autoremove --purge mysql-server-5.0sudo apt-get remove mysql-serversudo apt-get au ...