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. SpringBoot3集成Zookeeper

    标签:Zookeeper3.8 ,Curator5.5: 一.简介 ZooKeeper是一个集中的服务,用于维护配置信息.命名.提供分布式同步.提供组服务.分布式应用程序以某种形式使用所有这些类型的服 ...

  2. MyBatis——第一个程序

    MyBatis1:初识 MyBatis第一个程序 流程:搭建环境–>导入MyBatis–>编写代码–>测试 1.创建一张User表. 关键字id.username.pwd 2.导入相 ...

  3. [转帖]Linux命令(64)——strings命令

    https://cloud.tencent.com/developer/article/1414999 1.命令简介 strings命令是二进制工具集GNU Binutils的一员,用于打印文件中可打 ...

  4. [转帖]“炫技” 还是 “真硬核”,OpenPPL 实测阿里「倚天 710」芯片

    https://my.oschina.net/openppl/blog/5524424   本文将以深度学习模型推理应用为出发点,对「倚天 710」这款 ARM Server 芯片进行性能方面的实测. ...

  5. [转帖]k8s集群部署工具kubeadm详解

    https://zhuanlan.zhihu.com/p/670125857 kubeadm是快捷创建Kubernetes集群的最佳实践工具,我们只需用kubeadm init 和 kubeadm j ...

  6. [转帖]Mnesia reports that this RabbitMQ cluster has experienced a network partition.

    一 问题描述 双节点RabbitMQ集群发生了脑裂,节点日志报错: [error] <0.6318.0> Mnesia(rabbit@pc2): ** ERROR ** mnesia_ev ...

  7. reposync与createrepo创建离线yum源的方法

    背景 昨天晚上进行了在线升级银河麒麟V10SP2的audit和mate-indicator的rpm包 今天想了下,如果机器无法上网. 必须得在公司内部搭建一套离线的rpm源进行处理 想了下还是使用re ...

  8. [译]深入了解现代web浏览器(二)

    本文是根据Mariko Kosaka在谷歌开发者网站上的系列文章https://developer.chrome.com/blog/inside-browser-part2/ 翻译而来,共有四篇,该篇 ...

  9. canvas实现添加水印

    canvas添加水印思路 1.在画布上写上水印的名称(时间加上用户名) 2.canvas转化为base64,作为body的背景色 3.优化倾斜度和透明度 4.如果用户去除body的style水印消失 ...

  10. vue2-vue3监听子组件的生命周期的两种方式

    1.生命周期 生命周期是指:vue实例从创建到销毁这一系列过程.vue官网生命周期如下图所示: vue的生命周期有多少个 beforeCreate, created, beforeMount, mou ...