浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Element 对象
| ylbtech-浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Element 对象 |
| 1.返回顶部 |
HTML DOM Element 对象
HTML DOM 节点
在 HTML DOM (文档对象模型)中,每个部分都是节点:
- 文档本身是文档节点
- 所有 HTML 元素是元素节点
- 所有 HTML 属性是属性节点
- HTML 元素内的文本是文本节点
- 注释是注释节点
Element 对象
在 HTML DOM 中,Element 对象表示 HTML 元素。
Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。
NodeList 对象表示节点列表,比如 HTML 元素的子节点集合。
元素也可以拥有属性。属性是属性节点(参见下一节)。
浏览器支持
| IE | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|
所有浏览器都支持 Element 对象和 NodeList 对象。
属性和方法
下面的属性和方法可用于所有 HTML 元素上:
| 属性 / 方法 | 描述 |
|---|---|
| element.accessKey | 设置或返回元素的快捷键。 |
| element.appendChild() | 向元素添加新的子节点,作为最后一个子节点。 |
| element.attributes | 返回元素属性的 NamedNodeMap。 |
| element.childNodes | 返回元素子节点的 NodeList。 |
| element.className | 设置或返回元素的 class 属性。 |
| element.clientHeight | 返回元素的可见高度。 |
| element.clientWidth | 返回元素的可见宽度。 |
| element.cloneNode() | 克隆元素。 |
| element.compareDocumentPosition() | 比较两个元素的文档位置。 |
| element.contentEditable | 设置或返回元素的文本方向。 |
| element.dir | 设置或返回元素的内容是否可编辑。 |
| element.firstChild | 返回元素的首个子。 |
| element.getAttribute() | 返回元素节点的指定属性值。 |
| element.getAttributeNode() | 返回指定的属性节点。 |
| element.getElementsByTagName() | 返回拥有指定标签名的所有子元素的集合。 |
| element.getFeature() | 返回实现了指定特性的 API 的某个对象。 |
| element.getUserData() | 返回关联元素上键的对象。 |
| element.hasAttribute() | 如果元素拥有指定属性,则返回true,否则返回 false。 |
| element.hasAttributes() | 如果元素拥有属性,则返回 true,否则返回 false。 |
| element.hasChildNodes() | 如果元素拥有子节点,则返回 true,否则 false。 |
| element.id | 设置或返回元素的 id。 |
| element.innerHTML | 设置或返回元素的内容。 |
| element.insertBefore() | 在指定的已有的子节点之前插入新节点。 |
| element.isContentEditable | 设置或返回元素的内容。 |
| element.isDefaultNamespace() | 如果指定的 namespaceURI 是默认的,则返回 true,否则返回 false。 |
| element.isEqualNode() | 检查两个元素是否相等。 |
| element.isSameNode() | 检查两个元素是否是相同的节点。 |
| element.isSupported() | 如果元素支持指定特性,则返回 true。 |
| element.lang | 设置或返回元素的语言代码。 |
| element.lastChild | 返回元素的最后一个子元素。 |
| element.namespaceURI | 返回元素的 namespace URI。 |
| element.nextSibling | 返回位于相同节点树层级的下一个节点。 |
| element.nodeName | 返回元素的名称。 |
| element.nodeType | 返回元素的节点类型。 |
| element.nodeValue | 设置或返回元素值。 |
| element.normalize() | 合并元素中相邻的文本节点,并移除空的文本节点。 |
| element.offsetHeight | 返回元素的高度。 |
| element.offsetWidth | 返回元素的宽度。 |
| element.offsetLeft | 返回元素的水平偏移位置。 |
| element.offsetParent | 返回元素的偏移容器。 |
| element.offsetTop | 返回元素的垂直偏移位置。 |
| element.ownerDocument | 返回元素的根元素(文档对象)。 |
| element.parentNode | 返回元素的父节点。 |
| element.previousSibling | 返回位于相同节点树层级的前一个元素。 |
| element.removeAttribute() | 从元素中移除指定属性。 |
| element.removeAttributeNode() | 移除指定的属性节点,并返回被移除的节点。 |
| element.removeChild() | 从元素中移除子节点。 |
| element.replaceChild() | 替换元素中的子节点。 |
| element.scrollHeight | 返回元素的整体高度。 |
| element.scrollLeft | 返回元素左边缘与视图之间的距离。 |
| element.scrollTop | 返回元素上边缘与视图之间的距离。 |
| element.scrollWidth | 返回元素的整体宽度。 |
| element.setAttribute() | 把指定属性设置或更改为指定值。 |
| element.setAttributeNode() | 设置或更改指定属性节点。 |
| element.setIdAttribute() | |
| element.setIdAttributeNode() | |
| element.setUserData() | 把对象关联到元素上的键。 |
| element.style | 设置或返回元素的 style 属性。 |
| element.tabIndex | 设置或返回元素的 tab 键控制次序。 |
| element.tagName | 返回元素的标签名。 |
| element.textContent | 设置或返回节点及其后代的文本内容。 |
| element.title | 设置或返回元素的 title 属性。 |
| element.toString() | 把元素转换为字符串。 |
| nodelist.item() | 返回 NodeList 中位于指定下标的节点。 |
| nodelist.length | 返回 NodeList 中的节点数。 |
| 2.返回顶部 |
| 3.返回顶部 |
| 4.返回顶部 |
| 5.返回顶部 |
| 6.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Element 对象的更多相关文章
- 浏览器端-W3School:HTML DOM cells 集合
ylbtech-浏览器端-W3School:HTML DOM cells 集合 1.返回顶部 1. HTML DOM cells 集合 HTML DOM Table 对象 定义和用法 cells 集合 ...
- 浏览器端-W3School:JS & DOM 参考手册
ylbtech-浏览器端-W3School:JS & DOM 参考手册 1.返回顶部 1. JavaScript 参考手册 本部分提供完整的 JavaScript 参考手册: JavaScri ...
- 浏览器端使用javascript调用腾讯翻译api
最近在学习的小玩意,发现腾讯的文档十分坑爹,里面有很多错误的指示. 不过腾讯的机器翻译还是很牛的,我觉得翻译水准比谷歌好很多. 腾讯的机器翻译貌似在试用阶段,不收费,用QQ或微信登录即可申请使用. 首 ...
- Chrome浏览器端调试JavaScript
1. 一个超级简单的html文件拉入chrome浏览器 2. 右键-->检查 3. 点击Sources 4. html的12行加个断点 5. 刷新页面,点开Console面板,输入变量num,我 ...
- Javascript组成--ECMAScript,DOM,BOM
ECMAScript 部分 ECMAScript是一个标准,JS只是它的一个实现,其他实现包括ActionScript; “ECMAScript可以为不同种类的宿主环境提供核心的脚本编程能力”,即EC ...
- Javascript之BOM与DOM讲解
一.Javascript组成 JavaScript的实现包括以下3个部分: ECMAScript(核心) 描述了JS的语法和基本对象. 文档对象模型 (DOM) 处理网页内容的方法和接口 浏览器对象模 ...
- "浏览器端" 使用 commonjs 模块规范开发网页应用,像开发 node 那样开发网页应用
Containjs 1.0 Containjs 是什么? Containjs 是一个基于 Commonjs 模块管理规范的 浏览器端 的 JavaScript 模块加载器(目前为非标准的,代码会持续迭 ...
- DOM - Element 对象
http://www.runoob.com/dom/dom-element.html Element 对象 Element 对象代表 XML 文档中的一个元素.元素可以包含属性.其他元素或文本.如果一 ...
- 浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象
ylbtech-浏览器端-W3School-JavaScript-HTML DOM:HTML DOM Event 对象 1.返回顶部 1. HTML DOM Event 对象 实例 哪个鼠标按钮被点击 ...
随机推荐
- java中的compareto方法的详细介绍
java中的compareto方法的详细介绍 Java Comparator接口实例讲解(抽象方法.常用静态/默认方法) 一.java中的compareto方法 1.返回参与比较的前后两个字符串的as ...
- 终极之战:Linux & Windows
1.开源 当你买了一辆车,但你看不到引擎盖下面是什么?当你使用Windows驱动系统时就是如此.但是,相比之下,Linux完全是一个开源项目.你可以看看Linux操作系统的源代码,这是一个优点.Lin ...
- Docker的bridge和macvlan两种网络模式
项目上部署的Docker集群创建的容器网络遇到问题,借机会学习了一下docker的网络模式,其他类型我们用的不多,这里只列举我们常用的bridge和macvlan两种,下面的描述和截图有一些是直接从网 ...
- 修改linux系统TCP连接数
修改linux系统TCP连接数 centOS 6.x (1)vi /etc/sysctl.conf (2)添加参数 net.nf_conntrack_max = 655360 (3)sysctl -p ...
- windows10 mysql主从复制配置
注意:mysql主从复制,主从版本要一致! 生手永远在学习的路上,为了学习mysql主从复制,实现读写分离,于是在本地安装多个mysql实例来进行验证. 也因此有了下面的笔记,一来自我总结一下经验,二 ...
- 架构师成长之路5.7-Saltstack数据系统
点击架构师成长之路 架构师成长之路5.7-Saltstack数据系统 1. Saltstack的两种数据系统 Grains Pollars 2. Saltstack数据系统---Grains Grai ...
- automake中Makefile.am和configure.ac的格式及编译过程
step1:写Makefile.am step2:执行autoscan,会生成configurae.scan,修改configure.scan内容之后,命名为configure.ac step3:执行 ...
- eclipse中安装Activiti插件
由于公司网络问题,不能在线安装,下载到本地的插件,安装也是各种问题,后面终于找到能安装的插件包 1.下载eclipse activiti插件包 链接:https://pan.baidu.com/s/1 ...
- 第三次java测验1
设计思想: 输入一个字符串,然后将字符串倒置,比较字符串第i位上的字符与倒数第i位上的字符是否相同,如果都相同则字符串是回文:否则字符串不是回文. 源代码: package java3; import ...
- 2017 去哪儿网 研发4.18(offer)
去哪儿网一面(30分钟) 上来小哥哥先让自我介绍,然后开始问基础,说你计算机专业的,数据结构应该比较扎实吧,先写个快排.然后在我写的时候,小哥哥mac上敲敲打打,应该在看git,我简历上有留git的地 ...
