[HTML API]HTMLElement

最新推荐文章于 2024-04-26 16:33:01 发布
最新推荐文章于 2024-04-26 16:33:01 发布
阅读量101 收藏
点赞数
文章标签： 人工智能
原文链接：http://www.cnblogs.com/niuweb/archive/2012/01/30/API_HTMLElement.html
版权

 

interface HTMLElement : Element {
  // 访问DOM树
  NodeList getElementsByClassName(in DOMString classNames);

  // 动态插入标记
           attribute DOMString innerHTML;
           attribute DOMString outerHTML;
  void insertAdjacentHTML(in DOMString position, in DOMString text);

  // 元数据属性
           attribute DOMString id;
           attribute DOMString title;
           attribute DOMString lang;
           attribute DOMString dir;
           attribute DOMString className;
  readonly attribute DOMTokenList classList;
  readonly attribute DOMStringMap dataset;

  // 用户交互
           attribute boolean hidden;
  void click();
           attribute long tabIndex;
  void focus();
  void blur();
           attribute DOMString accessKey;
  readonly attribute DOMString accessKeyLabel;
           attribute boolean draggable;
  [PutForwards=value] attribute DOMSettableTokenList dropzone;
           attribute DOMString contentEditable;
  readonly attribute boolean isContentEditable;
           attribute HTMLMenuElement contextMenu;
           attribute boolean spellcheck;

  // 控制API
  readonly attribute DOMString commandType;
  readonly attribute DOMString label;
  readonly attribute DOMString icon;
  readonly attribute boolean disabled;
  readonly attribute boolean checked;
  // 样式
  readonly attribute CSSStyleDeclaration style;

  // 事件处理程序IDL属性
           attribute Function onabort;
           attribute Function onblur;
           attribute Function oncanplay;
           attribute Function oncanplaythrough;
           attribute Function onchange;
           attribute Function onclick;
           attribute Function oncontextmenu;
           attribute Function oncuechange;
           attribute Function ondblclick;
           attribute Function ondrag;
           attribute Function ondragend;
           attribute Function ondragenter;
           attribute Function ondragleave;
           attribute Function ondragover;
           attribute Function ondragstart;
           attribute Function ondrop;
           attribute Function ondurationchange;
           attribute Function onemptied;
           attribute Function onended;
           attribute Function onerror;
           attribute Function onfocus;
           attribute Function oninput;
           attribute Function oninvalid;
           attribute Function onkeydown;
           attribute Function onkeypress;
           attribute Function onkeyup;
           attribute Function onload;
           attribute Function onloadeddata;
           attribute Function onloadedmetadata;
           attribute Function onloadstart;
           attribute Function onmousedown;
           attribute Function onmousemove;
           attribute Function onmouseout;
           attribute Function onmouseover;
           attribute Function onmouseup;
           attribute Function onmousewheel;
           attribute Function onpause;
           attribute Function onplay;
           attribute Function onplaying;
           attribute Function onprogress;
           attribute Function onratechange;
           attribute Function onreadystatechange;
           attribute Function onreset;
           attribute Function onscroll;
           attribute Function onseeked;
           attribute Function onseeking;
           attribute Function onselect;
           attribute Function onshow;
           attribute Function onstalled;
           attribute Function onsubmit;
           attribute Function onsuspend;
           attribute Function ontimeupdate;
           attribute Function onvolumechange;
           attribute Function onwaiting;
};

getElementsByClassName

释义

必须返回一个活动的NodeList，其中的节点为调用该方法的HTMLElement对象的后裔，且它们的类（按空格分隔）中包含参数中给出的所有类。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

兼容性措施

if(!document.getElementsByClassName){    
    document.getElementsByClassName = function(cn){
        var rx    = new RegExp("\\b" + cn + "\\b");
        var allT  = document.getElementsByTagName("*");
        var allCN = [], i = 0, a;
        while (a = allT[i++]){
            if(a.className && a.className.indexOf(cn)+1){
                if(a.className===cn){allCN[allCN.length] = a;continue;}
                rx.test(a.className)?(allCN[allCN.length] = a):0;
            }
        }
        return allCN;
    }
}

innerHTML

释义

返回一个表现元素内容的HTML或XML片段。

兼容性状态

IE 6返回值中标签名称显示为大写形式。
IE 7/8返回值中标签名称显示为大写形式。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

outerHTML

释义

返回一个表现元素及其内容的HTML或XML片段。

兼容性状态

IE 6返回值中标签名称显示为大写形式。
IE 7/8返回值中标签名称显示为大写形式。
IE 9+ 
Chrome支持。
Firefox不支持。
Safari 

兼容性措施

if(typeof HTMLElement !== "undefined" && !("outerHTML" in HTMLElement.prototype)) { 
  HTMLElement.prototype.__defineSetter__("outerHTML",function(sHTML){ 
    var r=this.ownerDocument.createRange(); 
    r.setStartBefore(this); 
    var df=r.createContextualFragment(sHTML); 
    this.parentNode.replaceChild(df,this); 
    return sHTML; 
  }); 
  HTMLElement.prototype.__defineGetter__("outerHTML",function(){ 
    var attr; 
    var attrs=this.attributes; 
    var str="<"+this.tagName.toLowerCase(); 
    for(var i=0;i<attrs.length;i++){ 
      attr=attrs[i]; 
      if(attr.specified) 
        str+=" "+attr.name+'="'+attr.value+'"'; 
    }
    switch(this.tagName.toLowerCase()){
      case "area": 
      case "base": 
      case "basefont": 
      case "col": 
      case "frame": 
      case "hr": 
      case "img": 
      case "br": 
      case "input": 
      case "isindex": 
      case "link": 
      case "meta": 
      case "param": 
        return str+"/>";
    }
    return str+">"+this.innerHTML+"</"+this.tagName.toLowerCase()+">"; 
  });
}

insertAdjacentHTML(position, text)

释义

按照HTML或XML解析一个给出的字符串text，并且将返回的节点插入到树形结构中position参数所给出的位置。position参数如下：

beforebegin
在元素自身之前。
afterbegin
在元素之内，第一个子元素之前。
beforend
在元素之内，最后一个子元素之后。
afterend
在元素自身之后。
无效的值
（例如，在XML文档中，给出的字符串不能被格式化），则抛出一个SYNTAX_ERR异常。
不可用
（例如，在Document的根元素之后插入），则抛出一个NO_MODIFICATION_ALLOWED_ERR异常。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

id、title、lang、dir、className

释义

id
id IDL属性必须反映id内容属性。
id属性用于指定其元素的唯一标识符（ID）。它的值必须在元素的根子树（home subtree）的所有ID中保持唯一，并且包含至少一个字符。该值必须不包含任何空白字符。
title
title IDL属性必须反映title内容属性。
title属性表示元素的资讯信息，例如适当的提示。在链接上，它可能是目标资源的标题或描述；在图片上，它可能是图片来源或图片的描述；在段落中，它可能是该段文字的脚注或评论；在引文中，它可能是来源的详尽信息或出处。该属性的值是文字。
lang
lang IDL属性必须反映没有命名空间的lang内容属性。
lang属性（没有命名空间）表示元素的内容以及元素属性所包含的文字的主要语言。它的值必须为一个有效地BCP 47语言标签或空字符串。将该值设为空字符串表示主语言不明。
dir
dir IDL属性必须反映元素的dir内容属性，且仅限已知的值。
dir属性指定元素文本的书写方向。该属性是一个枚举属性，它的值为下列关键字和状态之一：ltr，表示元素的内容是明确的从左至右嵌入文本；rtl，表示元素的内容是明确的从右至左嵌入文本；auto，表示元素的内容是明确的嵌入文本，但方向取决于元素的内容的编写方式。
className
className IDL属性都必须反映元素的class内容属性。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

classList

释义

classList IDL属性都必须反映元素的class内容属性。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

dataset

释义

dataset IDL属性提供对元素的data-*属性的方便的存取功能。
当获取时，dataset IDL属性必须返回一个暴露该元素这些属性的DOMStringMap对象。
联用的名称将转化为骆驼大小写形式（camel-cased）。举例说明，data-foo-bar=""将转化为element.dataset.fooBar。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

hidden

释义

hidden IDL属性必须反映hidden内容属性。
hidden属性为一个布尔型属性。当标记该属性时，其表示该元素尚未或者不再相关。用户代理应当不对标记了该属性的元素进行渲染。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

click()、focus()、blur()

释义

click()
模仿该元素被点击。
focus()
使该元素获得焦点。
blur()
使该元素失去焦点。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

tabIndex

释义

tabIndex IDL属性必须反映tabindex内容属性的值。对于可聚焦的元素，其默认值为0；对于不可聚焦的元素，其默认值为-1。
tabindex内容属性指出该元素是否为可聚焦元素，是否可以通过顺序焦点导航达到，以及元素顺序焦点导航的相对顺序。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

accessKey

释义

accessKey IDL属性必须反映accesskey内容属性。
accesskey属性的值被用户代理用来创建一个激活或聚焦该元素的快捷键。

兼容性状态

IE 6支持。Alt+快捷键。
IE 7/8支持。Alt+快捷键。
IE 9+ 
Chrome支持。Alt+快捷键。
Firefox支持。Alt+Shift+快捷键。
Safari 

accessKeyLabel

释义

accessKeyLabel IDL属性必须返回能够表示元素被分配的快捷键的字符串，如果不存在则返回空字符串。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome不支持。
Firefox支持。
Safari 

draggable

释义

draggable IDL属性控制元素是否可拖拽，该属性由draggable内容属性决定。
如果内容属性为真，则为真；
如果内容属性为假，则为假；
如果内容属性为自动，则如果该元素为img元素或者拥有href内容属性的a元素则为真，否则为假。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

dropzone

释义

dropzone IDL属性必须反映dropzone内容属性。
其值必须为无序的唯一的不区分大小写的空格分隔的标记集合，允许的值如下：

copy
表明在该元素上拖拽一个允许的元素时，将产生一个拖拽数据的副本。
move
表明在该元素上拖拽一个允许的元素时，将把拖拽数据移动到新位置。
link
表明在该元素上拖拽一个允许的元素时，将链接到源数据。
任意超过三个字符的关键字，由两个字符U+0073拉丁小写字母S和U+003A冒号或者U+0053拉丁大写字母S和U+003A冒号（例如ASCII不区分大小写的匹配字符串“s:”）
表明拖拽数据元素分类纯Unicode字符串和拖拽数据元素类型字符串被设置为关键字剩余部分的元素允许拖拽。
任意超过三个字符的关键字，由两个字符U+0066拉丁小写字母F和U+003A冒号或者U+0046拉丁大写字母F和U+003A冒号（例如ASCII不区分大小写的匹配字符串“f:”）
表明拖拽数据元素分类文件和拖拽数据元素类型字符串被设置为关键字剩余部分的元素允许拖拽。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome不支持。
Firefox不支持。
Safari 

contentEditable

释义

在获取contentEditable IDL属性时，如果内容属性被设为状态真，则必须返回字符串“true”；如果内容属性被设为状态假，则必须返回字符串“false”；否则必须返回字符串“inherit”。在设置contentEditable IDL属性时，如果新值ASCII不区分大小写的匹配字符串“inherit”则内容属性必须被移除；如果新值ASCII不区分大小写的匹配字符串“true”则内容属性必须被设为字符串“true”；如果新值ASCII不区分大小写的匹配字符串“false”则内容属性必须被设为字符串“false”；否则属性设置函数必须抛出一个SYNTAX_ERR异常。
contenteditable属性是一个枚举属性，其换剪子为空字符串、true和false。空字符串及true关键字映射状态真。false关键字映射状态假。除此之外还有第三种状态继承，其为缺省默认值（及无效默认值）。
状态真表示该元素可编辑；状态继承表示如果该元素的父亲可编辑则该元素也可编辑；状态假表示该元素不可编辑。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

isContentEditable

释义

在获取isContentEditable IDL属性时，如果元素是可编辑的，则必须返回真；否则必须返回假。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

contextMenu

释义

contextMenu IDL属性必须反映contextmenu内容属性。contextmenu属性给出元素的上下文菜单。其值必须为DOM中一个menu元素的ID。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome不支持。
Firefox支持。
Safari 

spellcheck

释义

在获取spellcheck IDL属性时，如果元素的spellcheck内容属性为状态真、状态默认且元素的默认行为是默认为真、状态默认且元素的默认行为是默认为继承且元素的父元素的spellcheck IDL属性返回真，则必须返回真；否则必须返回假。
在设置spellcheck IDL属性时，如果新值为真，则元素的spellcheck内容属性必须被设为字符串“true”，否则必须被设为字符串“false”。
spellcheck属性是一个枚举属性，其值为空字符串、true和false。空字符串及true关键字映射状态真。false关键字映射状态假。除此之外还有第三种状态默认，其为缺省默认值（及无效默认值）。
状态真表示元素会进行拼写和语法检查。状态默认表示该元素是否进行检查有气默认行为（可能是其父元素的spellcheck状态）决定。状态假表示元素不进行检查。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome支持。
Firefox支持。但不支持拼写及语法检查。
Safari 

commandType、label、icon

释义

commandType
必须返回一个值为“command”、“radio”或“checkbox”的字符串，其值由元素定义的指令的类型决定，如果该元素没有定义指令，则其必须返回null。
label
必须返回命令的标签、或者如果元素没有定义命令或者没有指定标签则必须返回空。
icon
必须返回命令图标的绝对URL。如果元素没有指定图标或者元素没有定义命令，则该属性必须返回null。

兼容性状态

IE 6不支持。
IE 7/8不支持。
IE 9+ 
Chrome不支持。
Firefox不支持。
Safari 

disabled、checked

释义

disabled
如果命令的可用状态为命令不可用则必须返回真；如果命令的可用状态为命令可用则必须返回假。该属性不受命令的隐藏状态的影响。如果元素没有定义命令，则该属性必须返回假。
checked
如果命令的选中状态为命令被选中则必须返回真；如果命令的选中状态为命令未被选中则必须返回假。如果该元素没有定义命令，则该属性必须返回假。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

style

释义

style IDL属性必须返回一个CSSStyleDeclaration。

兼容性状态

IE 6支持。
IE 7/8支持。
IE 9+ 
Chrome支持。
Firefox支持。
Safari 

转载于:https://www.cnblogs.com/niuweb/archive/2012/01/30/API_HTMLElement.html

weixin_30553777
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
speech-recognizer:使用HTML5语音识别API的语音到文本
05-09
使用HTML5语音识别API的语音到文本。 查看 动机 没有多少人知道浏览器中内置了一个不错的语音识别API。 也许是一些预训练的模型？RNN / LSTM体系结构？ 支持不是最好的，但是嘿！ 为什么不提供该功能（如果有）？ ...
typescript如何解决类型“never”上不存在属性‘xxx‘问题？
a913396的博客
08-28 5483
element["属性名称"]
dom笔记
meinanqihao的博客
02-08 491
（一）HTMLDocument接口操作HTML文档的第一步就是获取对文档元素的引用，每一个元素在DOM中就是一个节点，所有的元素在DOM中构成一个节点树。用于获取元素节点定义的方法定义于HTMLDocument接口，window.document方法用于实现该接口，其定义的常用方法和属性如下：属性或方法返回值类型说明[getter]任何类型根据元素的name属性获取所有元素节点allHTMLAll...
类型“HTMLElement”上不存在属性“selectedIndex”
小妖666个人笔记
11-13 4627
将HTMLElement换成HTMLSelectElement就好了
ie支持htmlelement
白一梓的博客
05-21 245
[code="java"] var DOMElement ={ extend: function(name,fn){//添加名称为name的方法fn if(!document.all)//除了ie而外的浏览器都能够访问到HTMLElement这个类 HTMLElement.prototype[name] = fn;//eval("HTMLElement.p...
vue-aos:将“滚动动画”添加到Vue组件或HTML元素的Vue组件
05-01
是一个了不起的API，可让您观察一个或多个HTMLElement进入或离开视口的时间。 当元素进入视口时，此API有许多用例，例如无限滚动，延迟加载或动画。 当元素进入视口时，动画开始。 演示版 安装 只需使用您喜欢的...
shadow:Shadow是从HTMLElement继承的Web组件和自定义元素的基类
04-03
Shadow是从HTMLElement继承的Web组件和自定义元素的基类。 快速开始 编译example/my_example.ts ： deno bundle --config example/tsconfig.json example/my_example.ts > example/my_example.js 服务index.html...
uce:基于µhtml的自定义元素
03-21
API概述 μCE出口render ， html和svg ，从μHTML，加上它自己的方式来define的组件。 在1.2版中，它还导出了一个名为css的，可用于触发CSS缩小器。 签出或此。 // list of all exports import { define , render ...
HTML4j:在Java中拥有HTML元素的简单方法！
05-22
＃HTML4J＃##由Eyeballcode开发## 使用方法如下： HTML html = new HTML(); BODY body = new BODY(); html.addElement(body);... public class MyHTMLElement extends HTMLElement 现在，使用您想要的任何方
bigemap地图下载器 百度离线地图API接口文档及接口调用实例——infowindow类参考
tangshenq17565的博客
08-13 629
InfoWindow 此类表示地图上包含信息的窗口。 构造函数 描述 InfoWindow(content: String | HTMLElement, opts: InfoWindowOptions) 创建一个信息窗实例，其中content支持HTML内容。1.2版本开始content参数支持传入DOM结点 方法 返回值 描述 setWidth(width...
DOM笔记（三）：Element接口和HTMLElement接口
淡忘~浅思
12-10 3392
一、Element接口 Element接口表示一个元素，该接口扩展自Node接口，自然继承了Node接口的属性和方法，也有一套针对元素的属性和方法。 Element接口常见的属性比较少，常用的就是一个只读的tagName属性，该属性返回元素名，数据类型是DOMString。 Element接口定义的方法也主要是针对属性操作，常见方法如下： 方法名 数据类型 说明 getAttribute DOMString 返回对应属性 getAttributeNode Attr 返回对
html parent 属性,parentNode属性怎么用？
weixin_39998273的博客
06-10 1900
parentNode是javascript DOM对象中的一个属性，用于返回某节点的父节点。下面本篇文章就来给大家简单介绍一下parentNode属性，希望对大家有所帮助。parentNode属性可指定元素对象后获取该元素的父节点对象，如果指定的节点没有父节点则返回null 。语法node.parentNode返回值：作为一个节点对象返回父节点。说明：所有主要浏览器都支持 parentNode 属...
[HTML API]Element
weixin_30432179的博客
01-30 61
interface Element : Node { readonly attribute DOMString? namespaceURI; readonly attribute DOMString? prefix; readonly attribute DOMString localName; readonly attribute DOMString tagName...
linux 编译opencv遇到问题
123
04-26 260
linux 编译opencv遇到问题
TR6 - Transformer实战 单词预测
Loser
04-26 797
实验做的还是比较简单的，Transformer模型中的编码器直接使用的是pytorch框架预定义好的模块，但是对于理解整个模型的训练过程还是非常有帮助的。在实验的过程中，发现torchtext模块也已经不在维护了，和计算机视觉不同，自然语言处理的模型的输入格式灵活多变，经常需要自己写代码调整，比如上面的data_process函数。
《Vid2Seq》论文笔记
Zssss12的博客
04-22 1303
在这项工作中，我们引入了Vid2Seq，这是一种多模态单阶段密集事件字幕模型，它在大规模可用的叙述视频上进行了预训练，Vid2Seq 架构使用特殊的时间标记(time tokens)增强了语言模型，使其能够同时预测同一输出序列中的事件边界和文本描述。这种统一的模型需要大规模的训练数据，这在当前的注释数据集中是不可用的。我们表明，通过将转录语音的句子边界重新表述为伪事件边界，并使用转录的语音句子作为伪事件字幕，可以利用未标记的叙述视频进行密集视频字幕。
【AI】一文介绍索引增强生成RAG的原理和结构
最新发布
每日出拳老爷子的博客
04-26 151
今天向大家介绍一下关于RAG的一些知识和经验。这里说的RAG可以理解为目前针对企业知识库问答等AI应用场景的解决方案，这个场景就是利用自然语言大模型LLM与用户自有的文件进行对话的能力。
知识图谱的分类
suliuzhen的博客
04-22 438
知识图谱分为通用知识图谱与领域知识图谱两类，两类图谱本质相同，其区别主要体现在覆盖范围与使用方式上。（1）通用知识图谱：通用知识图谱主要强调知识的广度，可以形象地看成一个面向通用领域的结构化的百科知识库，其中包含了大量的现实世界中的常识性知识，覆盖面广，通常运用百科数据进行自底向上（Top-Down）的方法进行构建；
将html格式的string转化为htmlelement的实现方法
09-03
要将HTML格式的字符串转化为HTMLElement对象，可以使用DOMParser API。DOMParser是一个内建的JavaScript类，用于将XML和HTML字符串解析为DOM树，可以方便地操作和修改。 具体实现方法如下： 1. 创建一个新的DOM...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值