Element基类的属性与方法

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情

Element基类

描述: 定义了所有元素节点的公有属性与方法
说明: Element是非常通用的基类,所有 Document对象下的对象都继承它. 这个接口描述了所有相同种类的元素所普遍具有的方法和属性

原型属性
属性名类型描述
tagName标签名String返回此元素的标签名(大写)
namename属性值String获取元素的name属性
idid属性值String返回此元素的id标识
classNameclass属性值String返回此元素的class属性值
currentStylecss属性集合[object CSS2Properties]旧版IE实现, 等同于标准的window.getComputedStyle
classListcss列表[object DOMTokenList]返回一个元素的类属性的实时DOMTokenList 集合
attributes属性集合[object NamedNodeMap]返回该元素所有属性节点的一个实时集合
innerHTMLhtml字符串String设置或获取当前元素的所有后代html节点
outerHTMLhtml字符串String设置或获取当前元素和所有后代html节点
children子元素集合[object HTMLCollection]一个Node的子elements是一个动态更新的集合
firstElementChild第一个子元素element对象返回对象的第一个子Element或null
lastElementChild最后一个子元素element对象返回对象的最后子Element或null
previousElementSibling上一个兄弟元素element对象此元素的上一个元素节点
nextElementSibling下一个兄弟元素element对象此元素的下一个元素节点
childElementCount子元素数量Number返回当前元素的子元素数
clientWidth数值Number元素的盒内宽度
clientHeight数值Number元素的盒内高度
clientLeft数值Number元素的左边框的宽度
clientTop数值Number元素顶部边框的宽度
scrollWidth数值Number元素内容的宽度, 最小与clientWidth相等.
scrollHeight数值Number元素内容的高度, 最小与clientHeight相等.
scrollLeft数值Number读取或设置元素滚动条到元素左边的距离=元素的左边到视中可见区域的左边
scrollTop数值Number读取或设置元素滚动条到元素顶边的距离=元素的顶边到视中可见区域的顶边
原型方法
方法名返回值类型描述
getAttribute属性值String | Null根据属性名返回元素上一个指定的属性值。如果指定的属性不存在,则返回 null 或 “” (空字符串)
getAttributeNames所有属性名Array返回一个Array,该数组包含此元素的所有属性名称
getAttributeNode属性节点[object Attr]返回此元素指定属性名的指定attr节点类型
setAttributeundefinedUndefined设置此元素的属性值, 没有此属性名则创建
setAttributeNode被替换的属性节点[object Attr]为此元素添加Attr对象的属性节点, 返回被替换掉的属性节点
removeAttributeundefinedUndefined在此元素上移除某个属性
removeAttributeNode被删除的属性节点[object Attr]在此元素上 删除指定的Attr属性节点
hasAttributetrue | falseBoolean该元素是否包含有指定的属性
getElementsByClassName子元素列表[object HTMLCollection]返回动态包含有指定的class属性的所有子元素集合
getElementsByTagName子元素列表[object HTMLCollection]返回动态的包含所有指定标签名的元素的HTML集合
querySelector第一个子元素element对象返回指定的选择器组匹配的第一个子元素
querySelectorAll所有子元素[object NodeList]返回指定的选择器组匹配的NodeList元素列表
insertAdjacentElement被插入的元素element对象将一个给定的元素节点插入到相对于被调用的元素的给定的一个位置
insertAdjacentHTML被插入的html文本String指定的文本解析为HTML或XML,并将结果节点插入到DOM树中的指定位置
insertAdjacentText被插入的文本String将文本插入到指定的位置
getBoundingClientRect元素信息[object DOMRect]返回元素的大小及其相对于视口的位置
getClientRectsDOMRect集合[object DOMRectList]返回一个指向客户端中每一个盒子的边界矩形的矩形集合
setCaptureundefinedUndefined把鼠标事件重新定向到这个元素,直到鼠标按钮被释放或者 document.releaseCapture() 被调用。
Adjacent -参数 position位置选项
  • beforebegin —— 元素自身的前面
  • afterend —— 元素自身的后面
  • afterbegin —— 插入元素内部的第一个子节点之前
  • beforeend —— 插入元素内部的最后一个子节点之后
JavaScript【Element获取元素位置一、Element获取元素位置二、Element对象_方法、Attribute属性的操作 、dataset 属性】(十一) JavaScript【Element获取元素位置一、Element获取元素位置二、Element对象_方法、Attribute属性的操作、dataset 属性】(十一) 阅读详情

相关推荐

lit-element:一个简单的基类,用于创建快速,轻便的Web组件

LitElement 一个简单的基类,用于使用创建快速,轻量级的Web组件。 文献资料 完整文档可在。 概述 LitElement使用渲染到元素的并添加了API以帮助管理元素的属性属性。 LitElement属性的变化做出React,并使用lit-html声明lit-html渲染。 有关如何为lit-element创建模板的更多信息,请参见。 import { LitElement , html , css , customElement , property } from 'lit-element' ; // This decorator defines the element. @ customElement ( 'my-element' ) export class MyElement extends LitElement { //

Element类型知识大全

Element类型 除了Document类型之外,Element类型就要算是Web编程中最常用的类型了。Element类型用于表现XML或HTML元素,提供了对元素标签名、子节点及特性的访问。 要访问元素的标签名,可以使用nodeName属性,也可以使用tagName属性;这两个属性会返回相同的值(使用后者主要是为了清晰起见)。 在HTML中,标签名始终都以...

weixin_30328063的博客 801

Vue页面基类封装

Vuebase 类封装 vue在实际开发中,代码封装demo 这里以多个页面的,查询接口,getlist 为例 分析多个页面 getlist 行为得出 相同点 1 .1 进行网络请求 1.2 将接口结果赋值给变量 1.3 变量 data 不同点 2.1 接口Url 得出 : 子类定义 apiPath ,方法写在父类中 1:父类代码 //基类 base <template> <section> 父类的模板层代码 </sect...

u011416588的博客 1734

JS中 Element常用属性和常用方法

JS中 Element常用属性和常用方法

m0_55557411的博客 2500

Vue组件的继承用法

Vue组件的继承用法

qq_49080170的博客 2365

Vue2.0+AntvX6—基类Cell

vue2.0 AntvX6 基类Cell 学习官网的包含自己的一些理解,日后会慢慢完善补充

ZMN0057的博客 3884

找到element后如何取值_浅析NodeElement的区别

我们经常使用document.getElementById去获取DOM中的元素,也会使用childNodes来获取子节点。那么ElementNode的区别是什么?而什么又是HTMLCollection,HTMLElement,和NodeList呢?Node提供的节点Element提供的节点在学jQuery的时候,大家是不是也是总混淆NodeElement节点左边为Node/右边为Elemen...

weixin_39874196的博客 564

DOM中Element对象常用属性方法大全

DOM中Element对象常用属性方法大全

weixin_44992737的博客 3663

element-UI的属性,事件,方法

总结 在使用组件的方法时需要在对应的组件中加入 ref = “组件别名” 在调用方法时直接使用 this.$refs.组件别名.方法名() 注意:在element-UI中所有组件 都存在 属性 事件 和方法 属性:直接写在对应的组件标签上,使用方法 :属性名 = 属性值 方式 事件:直接使用vue绑定事件方式写在对应的组件标签上,使用方式 :事件名 = vue中事件处理函数 方法: 1.在对应组件标签上使用 ref = “组件别名” ,2.通过使用this.$refs.组件别名.方法名() 进行调

weixin_41824429的博客 3824

element.classList属性方法应用

element.classList属性用于返回一个元素的className集合,并且该属性拥有add,remove,toggle,contains方法,详见:https://developer.mozilla.org/en-US/docs/DOM/element.classList。 一般我们再操作dom节点的className时经常会有以下4个需求: 判断该节点是否存在某个class

sky_jser 9480

Element常用的属性方法

Element常用的属性方法

m0_55557411的博客 2064

selenium之element常见属性方法

在selenium中,Web Element对象提供了许多属性方法来和页面上的元素进行交互;好了,Web Element的一些常用属性方法就先介绍到这里了;剩下的一些可以私下自己练习练习。上面就是常见的一些属性方法了,当然还有一些其他的;下面废话不多说,开始操练起来。

小鑫仔的博客 1037

element元素 取属性_浅析NodeElement的区别

我们经常使用document.getElementById去获取DOM中的元素,也会使用childNodes来获取子节点。那么ElementNode的区别是什么?而什么又是HTMLCollection,HTMLElement,和NodeList呢?Node提供的节点Element提供的节点在学jQuery的时候,大家是不是也是总混淆NodeElement节点左边为Node/右边为Elemen...

weixin_33662430的博客 749

JavaScript DOM属性方法element元素对象

在HTML DOM中,elment对象表示HTML纳素,可以包含的节点类型有元素u节点、文本节点、注释节点。它们有响应的属性方法,有很多都是我们之前用过的。

zhishunet 987

Element属性方法整理

属性/方法名 描述 accessKey 为元素指定获取焦点的快捷键 align ? ariaAtomic 指示辅助技术是否根据aria-relevant定义的通知显示全部或部分更改区域 ariaAutoComplete 反映了 aria-autocomplete属性的值,指示输入文本是否可触发自动完成功能 ariaBusy 反映了 aria-busy属性的值,指示元素是否正在被修改,因为辅助技术可能希望等到修改完成后再将它们暴露给用户 ariaChecked 反映了 ar...

林中路 5425

Element方法属性

element event 事件源 &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &lt;meta http-equiv="X-UA-Compatible"

weixiaoderensheng的博客 2689

java element 属性_Java dom4j获取,添加,删除,查找,设置Element属性方法

Java dom4j获取,添加,删除,查找,设置Element属性方法1.取得某节点下的某属性Element root=document.getRootElement();Attribute attribute=root.attribute("size");// 属性名name2.取得属性的文字// 也可以用String text=attribute.getText();// 这个是取得根节点下...

weixin_39562089的博客 2625

元素Element节点,属性方法

1.Element节点对象对应网页的 HTML 元素。每一个 HTML 元素,在 DOM 树上都会转化成一个Element节点对象。 2.不同的 HTML 元素对应的元素节点是不一样的,浏览器使用不同的构造函数,生成不同的元素节点。 比如<a>元素的构造函数是HTMLAnchorElement(),<button>是HTMLButtonElement()。 因此,元素节点不是一种对象,而是许多种对象,这些对象除了继承Element对象的属性方法,还有各自独有的属性方法。 3

qq_39342118的博客 959

element元素 取属性_js element类型的属性方法整理

Element类型除了Document类型,我们Web编程中最常用的类型就是Element类型啦.Element 类型用于表现XML或HTML元素,提供了对元素标签名,子节点,特性的访问特征nodeType值为1nodeName为元素标签名nodeValue为nullparentNode可能是Document或Element子节点可能是Element,Text,Comment,Processing...

weixin_28687807的博客 685
上一篇: Documen接口提供的属性与方法
下一篇: HtmlElement的属性与方法
里面的世界真美丽
博客等级 码龄12年 0粉丝 20原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值