DOM的常用属性

简介: DOM的常用属性

DOM的常用属性



ele.appendChild(dom对象)  //向元素添加新的子节点,作为最后一个子节点。
ele.attributes  //返回元素的属性集合,通过索引访问,.nodeName表示属性名,.nodeValue表示属性值
ele.childNodes  //返回元素子节点的NodeList(包含文本节点)。
ele.children  //返回元素子节点(不含文本节点)
ele.className //设置或返回元素的class属性。
ele.clientHeight  //返回元素的可见高度。
ele.clientWidth //返回元素的可见宽度。
ele.cloneNode(dom对象)  //克隆元素。
ele.firstChild  //返回元素的首个子元素(含文本节点)。
ele.firstElementChild //返回元素的首个子元素(不含文本节点)。
ele.getAttribute(属性名) //返回元素节点的指定属性值。
ele.getElementsByTagName(标签名) //返回拥有指定标签名的所有子元素的集合。
ele.hasAttribute(属性名) //如果元素拥有指定属性,则返回true,否则返回false。
ele.hasAttributes(属性名)  //如果元素拥有属性,则返回true,否则返回false。
ele.hasChildNodes() //如果元素拥有子节点,则返回true,否则false。
ele.id  //设置或返回元素的id。
ele.innerHTML //设置或返回元素的内容。
ele.insertBefore(要插入的内容,插在那个元素前面) //在指定的已有的子节点之前插入新节点。
ele.lastChild //返回元素的最后一个子元素(含文本节点)。
ele.lastElementChild  //返回元素的最后一个子元素(不含文本节点)。
ele.nextSibling //返回位于相同节点树层级的下一个节点(含文本节点)。
ele.nextElementSibling  //返回位于相同节点树层级的下一个节点(不含文本节点)。
ele.nodeName  //返回元素的名称。
ele.nodeType  //返回元素的节点类型(标签1,文本3,属性2)。
ele.nodeValue //设置或返回元素值。
ele.offsetHeight  //返回元素的高度。
ele.offsetWidth //返回元素的宽度。
ele.offsetLeft  //返回元素的水平偏移位置。
ele.offsetParent  //返回元素的偏移容器。
ele.offsetTop //返回元素的垂直偏移位置。
ele.parentNode  //返回元素的父节点。
ele.previousSibling //返回位于相同节点树层级的前一个元素(含文本节点)。
ele.previousElementSibling  //返回位于相同节点树层级的前一个元素(不含文本节点)。
ele.removeAttribute(属性名)  //从元素中移除指定属性。
ele.removeChild(dom对象)  //从元素中移除子节点。
ele.replaceChild(dom对象) //替换元素中的子节点。
ele.scrollHeight  //返回元素的整体高度。
ele.scrollLeft  //返回元素左边缘与视图之间的距离。
ele.scrollTop //返回元素上边缘与视图之间的距离。
ele.scrollWidth //返回元素的整体宽度。
ele.setAttribute(属性名,属性值) //把指定属性设置或更改为指定值。
ele.style //设置或返回元素的style属性。
ele.tagName //返回元素的标签名。
ele.title //设置或返回元素的title属性。
点击事件 onclick 
鼠标移入 onmouseover 
鼠标移出 onmouseout
相关文章
|
5月前
|
JavaScript
DOM 属性列表(命名节点图 Named Node Map)
`DOM`中的`Named Node Map`是元素节点属性的列表,自动更新增删操作。代码示例载入"books.xml",获取第一个`<book>`元素的属性列表,`x.length`显示属性数量,`x.getNamedItem("category").nodeValue`输出"category"属性值,如"cooking",并显示属性总数1。
|
1月前
|
移动开发 JavaScript 前端开发
原生js如何获取dom元素的自定义属性
原生js如何获取dom元素的自定义属性
52 4
|
6月前
|
JavaScript
DOM 属性列表(命名节点图 Named Node Map)
`DOM`的`Named Node Map`是元素节点的属性列表,类似节点列表但有区别。当属性增删时,列表自动更新。示例代码加载"books.xml",获取第一个`<book>`元素的属性节点列表,`x.length`表示属性数量,`x.getNamedItem("category").nodeValue`显示"category"属性值。输出为:`cooking`和`1`,表示类别为烹饪且有1个属性。
|
6月前
|
XML JavaScript 前端开发
XML DOM - 属性和方法
XML DOM通过属性(如nodeName、nodeValue、parentNode、childNodes和attributes)和方法提供编程接口,让开发者用JavaScript等语言以节点方式交互XML。属性描述节点信息,方法执行操作,如删除节点。
|
6月前
|
XML JavaScript 前端开发
DOM 属性列表(命名节点图 Named Node Map)
这段内容介绍了如何使用JavaScript操作XML文档中的DOM属性。通过`getElementsByTagName`获取元素后,`attributes`属性返回一个命名节点图(Named Node Map),表示元素的属性列表,该列表会自动更新。示例代码展示了加载"books.xml",获取第一个`<book>`元素的属性列表,然后利用`getNamedItem()`方法获取"category"属性的值并输出,同时显示属性数量。
|
2月前
|
JavaScript 前端开发
前端基础(十)_Dom自定义属性(带案例)
本文介绍了DOM自定义属性的概念和使用方法,并通过案例展示了如何使用自定义属性来控制多个列表项点击变色的独立状态。
43 0
前端基础(十)_Dom自定义属性(带案例)
|
5月前
|
存储 JavaScript
DOM 属性列表(命名节点图 Named Node Map)
`DOM`的`Named Node Map`代表元素的属性列表,当属性增删时会自动更新。示例展示了如何加载"books.xml",获取第一个`<book>`元素的属性。变量`x`存储属性列表,`x.length`显示属性数量,`x.getNamedItem("category")`返回"category"属性值。代码输出属性值"cooking"和属性数量1。
|
6月前
|
XML JavaScript 前端开发
属性和方法向 XML DOM 定义了编程接口
XML DOM 提供编程接口,通过属性和方法操作XML结构。使用JavaScript等语言,可访问和修改节点。属性如nodeName、nodeValue揭示节点信息,方法如getElementsByTagName、appendChild、removeChild实现查找、添加和删除节点功能。节点对象x的应用示例贯穿其中。
|
5月前
|
JavaScript
DOM 属性列表(命名节点图 Named Node Map)
`DOM`的`Named Node Map`是属性节点列表,由元素的`attributes`属性返回。它自动更新增删属性。示例代码加载"books.xml",获取第一个`<book>`元素的属性列表,`x.getNamedItem("category").nodeValue`显示"cooking",`x.length`显示属性数量1。
|
6月前
|
XML JavaScript 前端开发
XML DOM - 属性和方法
**XML DOM 提供编程接口,将XML转换为节点对象,便于通过JS等语言操作。属性如 nodeName、nodeValue、parentNode、childNodes 和 attributes 描述节点详情。方法用于执行操作,如删除节点。**