HTMLElement对象

任何HTML元素都继承于HTMLElement对象,一些元素直接实现这个接口,而另一些元素通过多层继承来实现它。

属性

从其父元素Element继承属性,并从DocumentAndElementEventHandlersElementCSSInlineStyleGlobalEventHandlersHTMLOrForeignElementTouchEventHandlers实现这些属性。

  • HTMLElement.accessKey: 获取/设置元素访问的快捷键。
  • HTMLElement.accessKeyLabel: 只读,返回DOMString,包含元素访问的快捷键的字符串。
  • HTMLElement.contentEditable: 获取/设置元素的可编辑状态。
  • HTMLElement.isContentEditable: 只读,返回Boolean值表明元素的内容是否可编辑。
  • HTMLOrForeignElement.dataset: 只读,返回DOMStringMap,用以获取元素的自定义属性data-*,是一个对象即key-value结构。
  • HTMLElement.dir: 获取/设置元素的方向,可选的值有ltrrtlauto
  • HTMLElement.draggable: 设置/获取元素是否可以拖拽。
  • HTMLElement.enterkeyhint: 返回一个DOMString,定义为虚拟键盘上的enter键提供什么操作标签或图标。
  • HTMLElement.hidden: 获取/设置元素是否隐藏。
  • HTMLElement.inert: 返回一个布尔值,指示用户代理是否必须在用户交互事件、页内文本搜索和文本选择方面充当给定节点的角色。
  • HTMLElement.innerText: 设置或取得节点及其后代的呈现的文本内容,如果作为一个getter近似于当用户用光标突出显示元素的内容并将其复制到剪贴板时所获得的文本。
  • HTMLElement.lang: 返回一个DOMString,表示元素的属性、文本和元素内容的语言。
  • HTMLElement.noModule: 返回一个布尔值,指示是否可以在支持模块脚本的用户代理中执行导入脚本。
  • HTMLOrForeignElement.nonce: 返回内容安全策略用于确定是否允许进行给定提取的一次使用的密码。
  • HTMLElement.offsetHeight: 只读,返回一个double值,其中包含元素相对于布局的高度。
  • HTMLElement.offsetLeft: 只读,返回一个double值,即从此元素的左边界到offsetParent的左边界的距离。
  • HTMLElement.offsetParent: 只读,返回一个Element,该元素是当前从中计算所有偏移量计算的元素。
  • HTMLElement.offsetTop: 只读,返回一个double值,即从此元素的顶部边框到offsetParent的顶部边框的距离。
  • HTMLElement.offsetWidth: 只读,返回一个double类型,包含元素相对于布局的宽度。
  • HTMLElement.spellcheck: 是控制拼写检查的布尔值,它存在于所有HTML元素中,但并不是对所有元素都有影响。
  • HTMLElement.style: 返回一个CSSStyleDeclaration,它是表示元素的样式属性的声明的对象。
  • HTMLOrForeignElement.tabIndex: 是一个长整数,表示按Tab键顺序排列的元素的位置。
  • HTMLElement.title: 返回一个DOMString,它包含当鼠标放在元素上时出现在弹出框中的文本。
  • HTMLElement.translate: 是表示翻译的布尔值。

方法

从其父元素Element继承方法,并从DocumentAndElementEventHandlersElementCSSInlineStyleGlobalEventHandlersHTMLOrForeignElementTouchEventHandlers实现这些方法。

  • HTMLElement.attachInternals(): 将ElementInternals实例附加到自定义元素。
  • HTMLOrForeignElement.blur(): 从当前焦点元素中移除键盘焦点。
  • HTMLElement.click(): 向元素发送鼠标单击事件。
  • HTMLOrForeignElement.focus(): 使元素成为当前键盘焦点。
  • HTMLElement.forceSpellCheck(): 对元素的内容运行拼写检查程序。

每日一题

https://github.com/WindrunnerMax/EveryDay

参考

https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement

HTMLElement对象的更多相关文章

  1. Python爬虫解析htm时lxml的HtmlElement对象获取和设置inner html方法

    Python的lxml是一个相当强悍的解析html.XML的模块,最新版本支持的python版本从2.6到3.6,是写爬虫的必备利器.它基于C语言库libxml2 和 libxslt,进行了Pytho ...

  2. JavaScript权威设计--Window对象之Iframe(简要学习笔记十四)

    1.Window对象属性的文档元素(id) 如果在HTML文档中用id属性来为元素命名,并且如果Window对象没有此名字的属性,Window对象会赋予一个属性,它的名字是id属性的值,而他们的值指向 ...

  3. ExtJs 获取Dom对象

    对象指页面上的某一部分,如:Input等.我觉得在EXT JS中会有三类基本对象,htmlelement , EXT.Element和CompositeElement .分别解释一下: htmlele ...

  4. 如何判断一个js对象是否一个DOM对象

    我们在写js代码时有时需要判断某个对象是不是DOM对象,然后再进行后续的操作,这里我给出一种兼容各大浏览器,同时又算是比较稳妥的一种方法. 要判断一个对象是否DOM对象,首先想到的无非就是它是否具有D ...

  5. Window对象

    Window对象:         Window 对象表示浏览器中打开的窗口,如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框 ...

  6. js 对象(Object)

    一.对象 除了字符串.数字.true.false.null和undefined之外,javascript中的值都是对象. javascript对象属性包括名字和值,属性名可以是包含空字符串在内的任意字 ...

  7. 【使用 DOM】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  8. 【温故而知新-Javascript】使用 Document 对象

    Document 对象时通往DOM功能的入口,它向你提供了当前文档的信息,以及一组可供探索.导航.搜索或操作结构与内容的功能. 我们通过全局变量document访问Document对象,它是浏览器为我 ...

  9. 第十二章:window对象

    第十一章介绍了window对象及其客户端javascript所扮演的核心角色:它是客户端javascript程序的全局对象.本章介绍window对象的属性和方法,这些属性定义了不同的API,但是只有一 ...

  10. htm Dom对象与 Xml Dom对象的理解

    html 是基于Xml的文档规范.是一种特殊的xml文档,这一点很重要 1.xml 文档的操作,java,c#,...各种语言都提供了很好的api对文档进行解析,操作.当然js 也不例外,提供了一系列 ...

随机推荐

  1. Spring——静态/动态代理模式

    代理模式 代理模式: 静态代理 动态代理 学习aop之前,要先了解代理模式 静态代理 抽象角色:一般使用接口或者抽象类来实现 真实角色:被代理的角色 代理角色:代理真实角色:代理真实角色后,一般会做一 ...

  2. [转帖]060-轻量级基于curl的seafile上传脚本

    https://anjia0532.github.io/2021/04/07/seafile-client-curl/ 这是坚持技术写作计划(含翻译)的第 60 篇,定个小目标 999,每周最少 2 ...

  3. 华城金锐申威SW64服务器重装过程

    华城金锐申威SW64服务器重装过程 背景 这边为了进行兼容性验证新进了两套申威的服务器. 一台机器带着安装好的操作系统了. 但是另外一套没有对应的系统. 端午期间想着趁着上班的人少, 加吧给处理一下. ...

  4. [转帖]关于 AREX

    https://arextest.github.io/website/zh-Hans/docs/intro/ AREX 介绍​ 背景​ 对于一个初上线的简单服务,只需通过常规的自动化测试加上人工即可解 ...

  5. [转帖]Systemd 指令

    一.由来 历史上,Linux 的启动一直采用init进程. 下面的命令用来启动服务. $ sudo /etc/init.d/apache2 start # 或者 $ service apache2 s ...

  6. [转帖]Nginx四层负载均衡详解

    https://developer.aliyun.com/article/885599?spm=a2c6h.24874632.expert-profile.315.7c46cfe9h5DxWK 202 ...

  7. BAdI:INVOICE_UPDATE 导致MM Invoice Doc. Missing

    Symptom:发票校验过程中,对应发票号生成,FI凭证也产生,但是对应RBKP,RSEG中无相应的发票. 原先这一问题SAP早给出过解释,参照note:1876234 Cause:在SD MM模块中 ...

  8. vite按需加载element-plus,减少项目体积,你必须学会

    1.在项目中安装 $ npm install element-plus --save $ yarn add element-plus $ pnpm install element-plus 2.安装对 ...

  9. 快速上手NPM包管理

    NPM官网 前提 安装nodejs 检测安装成功的命令 node -v 显示版本号即为安装成功 快速上手教程 第一步注册NPM账号官网在上面 第二步骤随便找个地方新建一个文件夹 然后这个文件夹我们用C ...

  10. Vue双向数据绑定原理-中

    defineProperty方法 defineProperty除了可以动态修改/新增对象的属性以外, 还可以在修改/新增的时候给该属性添加get/set方法, 从而实现数据劫持. defineProp ...