Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[html] 第3天 HTML全局属性(global attribute)有哪些(包含H5)? #7

Open
haizhilin2013 opened this issue Apr 18, 2019 · 32 comments
Labels
html html

Comments

@haizhilin2013
Copy link
Collaborator

[html] 第3天 HTML全局属性(global attribute)有哪些(包含H5)?

@haizhilin2013 haizhilin2013 added the html html label Apr 18, 2019
@undefinedYu
Copy link
Contributor

  • class
  • id
  • data
  • type
  • href
  • style
  • width
  • height
  • targe
  • checked
  • disabled
  • requie
  • ref
  • alt
  • title
  • name
  • mulitp...多选
  • value
  • replaceholder
  • src

@yxkhaha
Copy link

yxkhaha commented Apr 19, 2019

  • id
  • class
  • style
  • title
  • data

@qingleizhang123
Copy link

全局属性:用于任何HTML5元素的属性

  • accesskey:设置快捷键
  • class:为元素设置类标识
  • contenteditable:指定元素内容是否可编辑
  • contextmenu:自定义鼠标右键弹出上下文菜单内容(仅firefox支持)
  • data-*:为元素增加自定义属性
  • dir:设置元素文本方向(默认ltr;rtl)
  • draggable:设置元素是否可拖拽
  • dropzone:设置元素拖放类型(copy|move|link,H5新属性,主流均不支持)
  • hidden:规定元素仍未或不在相关
  • id:元素id,文档内唯一
  • lang:元素内容的语言
  • spellcheck:是否启动拼写和语法检查
  • style:行内css样式
  • tabindex:设置元素可以获得焦点,通过tab导航
  • title:规定元素有关的额外信息
  • translate:元素和子孙节点内容是否需要本地化(均不支持)

@Damon99999
Copy link

id
class
title
style

@pma934
Copy link

pma934 commented Jun 26, 2019

是document.body.proto.__proto__里的内容么?

  • accessKey: (...)
  • assignedSlot: (...)
  • attributeStyleMap: (...)
  • attributes: (...)
  • autocapitalize: (...)
  • baseURI: (...)
  • childElementCount: (...)
  • childNodes: (...)
  • children: (...)
  • classList: (...)
  • className: (...)
  • clientHeight: (...)
  • clientLeft: (...)
  • clientTop: (...)
  • clientWidth: (...)
  • contentEditable: (...)
  • dataset: (...)
  • dir: (...)
  • draggable: (...)
  • firstChild: (...)
  • firstElementChild: (...)
  • hidden: (...)
  • id: (...)
  • innerHTML: (...)
  • innerText: (...)
  • inputMode: (...)
  • isConnected: (...)
  • isContentEditable: (...)
  • lang: (...)
  • lastChild: (...)
  • lastElementChild: (...)
  • localName: (...)
  • namespaceURI: (...)
  • nextElementSibling: (...)
  • nextSibling: (...)
  • nodeName: (...)
  • nodeType: (...)
  • nodeValue: (...)
  • nonce: (...)
  • offsetHeight: (...)
  • offsetLeft: (...)
  • offsetParent: (...)
  • offsetTop: (...)
  • offsetWidth: (...)
  • onabort: (...)
  • onauxclick: (...)
  • onbeforecopy: (...)
  • onbeforecut: (...)
  • onbeforepaste: (...)
  • onblur: (...)
  • oncancel: (...)
  • oncanplay: (...)
  • oncanplaythrough: (...)
  • onchange: (...)
  • onclick: (...)
  • onclose: (...)
  • oncontextmenu: (...)
  • oncopy: (...)
  • oncuechange: (...)
  • oncut: (...)
  • ondblclick: (...)
  • ondrag: (...)
  • ondragend: (...)
  • ondragenter: (...)
  • ondragleave: (...)
  • ondragover: (...)
  • ondragstart: (...)
  • ondrop: (...)
  • ondurationchange: (...)
  • onemptied: (...)
  • onended: (...)
  • onerror: (...)
  • onfocus: (...)
  • onfullscreenchange: (...)
  • onfullscreenerror: (...)
  • ongotpointercapture: (...)
  • oninput: (...)
  • oninvalid: (...)
  • onkeydown: (...)
  • onkeypress: (...)
  • onkeyup: (...)
  • onload: (...)
  • onloadeddata: (...)
  • onloadedmetadata: (...)
  • onloadstart: (...)
  • onlostpointercapture: (...)
  • onmousedown: (...)
  • onmouseenter: (...)
  • onmouseleave: (...)
  • onmousemove: (...)
  • onmouseout: (...)
  • onmouseover: (...)
  • onmouseup: (...)
  • onmousewheel: (...)
  • onpaste: (...)
  • onpause: (...)
  • onplay: (...)
  • onplaying: (...)
  • onpointercancel: (...)
  • onpointerdown: (...)
  • onpointerenter: (...)
  • onpointerleave: (...)
  • onpointermove: (...)
  • onpointerout: (...)
  • onpointerover: (...)
  • onpointerup: (...)
  • onprogress: (...)
  • onratechange: (...)
  • onreset: (...)
  • onresize: (...)
  • onscroll: (...)
  • onsearch: (...)
  • onseeked: (...)
  • onseeking: (...)
  • onselect: (...)
  • onselectionchange: (...)
  • onselectstart: (...)
  • onstalled: (...)
  • onsubmit: (...)
  • onsuspend: (...)
  • ontimeupdate: (...)
  • ontoggle: (...)
  • onvolumechange: (...)
  • onwaiting: (...)
  • onwebkitfullscreenchange: (...)
  • onwebkitfullscreenerror: (...)
  • onwheel: (...)
  • outerHTML: (...)
  • outerText: (...)
  • ownerDocument: (...)
  • parentElement: (...)
  • parentNode: (...)
  • part: (...)
  • prefix: (...)
  • previousElementSibling: (...)
  • previousSibling: (...)
  • scrollHeight: (...)
  • scrollLeft: (...)
  • scrollTop: (...)
  • scrollWidth: (...)
  • shadowRoot: (...)
  • slot: (...)
  • spellcheck: (...)
  • style: (...)
  • tabIndex: (...)
  • tagName: (...)
  • textContent: (...)
  • title: (...)
  • translate: (...)

@Konata9
Copy link

Konata9 commented Jul 1, 2019

查了 MDN,感觉比 document.body.__proto__ 要少一点

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes

@poporeki
Copy link

poporeki commented Jul 4, 2019

日常用的也就一些吧,还有好多不建议使用的

  • id
  • class
  • name
  • title
  • data-
  • placeholder
  • width
  • height
  • bgcolor
  • style
  • src
  • href
  • disabled
  • value

@censek
Copy link

censek commented Sep 26, 2019

全局属性 可用于任何 HTML 元素

属性 描述
accesskey 设置访问元素的键盘快捷键。
class 规定元素的类名(classname)
contenteditableNew 规定是否可编辑元素的内容。
contextmenuNew 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单
data-*New 用于存储页面的自定义数据
dir 设置元素中内容的文本方向。
draggableNew 指定某个元素是否可以拖动
dropzoneNew 指定是否将数据复制,移动,或链接,或删除
hiddenNew hidden 属性规定对元素进行隐藏。
id 规定元素的唯一 id
lang 设置元素中内容的语言代码。
spellcheckNew 检测元素是否拼写错误
style 规定元素的行内样式(inline style)
tabindex 设置元素的 Tab 键控制次序。
title 规定元素的额外信息(可在工具提示中显示)
translateNew 指定是否一个元素的值在页面载入时是否需要翻译

@RQSA
Copy link

RQSA commented Oct 4, 2019

全局属性:用于任何HTML5元素的属性

  • accesskey:设置快捷键
  • class:为元素设置类标识
  • contenteditable:指定元素内容是否可编辑
  • contextmenu:自定义鼠标右键弹出上下文菜单内容(仅firefox支持)
  • data-*:为元素增加自定义属性
  • dir:设置元素文本方向(默认ltr;rtl)
  • draggable:设置元素是否可拖拽
  • dropzone:设置元素拖放类型(copy|move|link,H5新属性,主流均不支持)
  • hidden:规定元素仍未或不在相关
  • id:元素id,文档内唯一
  • lang:元素内容的语言
  • spellcheck:是否启动拼写和语法检查
  • style:行内css样式
  • tabindex:设置元素可以获得焦点,通过tab导航
  • title:规定元素有关的额外信息
  • translate:元素和子孙节点内容是否需要本地化(均不支持)

@0x3c
Copy link

0x3c commented Oct 14, 2019

 // HTMLElement 原型上的所有可枚举属性.
console.log(Object.keys(HTMLElement.prototype));

@zlqGitHub
Copy link

经常使用到的就是:title、style、class、id

@vinceok
Copy link

vinceok commented Jan 15, 2020

  1. id:元素的id,文档内唯一
  2. class:元素的类标识
  3. style:元素的行内样式
  4. title:元素的额外信息
  5. tabindex:元素的 Tab 键控制次序
  6. data-*:元素的自定义属性
  7. lang:元素内容的语言

@susanforme
Copy link

class id  style 

@kaifeiji
Copy link

width、height不是全局属性。

@blueRoach
Copy link

class、id、title、tableindex、data-*、lang、hidden、contenteditable、dir

@giggleCYT
Copy link

属性 描述
accesskey 设置访问元素的键盘快捷键。
class 规定元素的类名(classname)
contenteditable(h5) 规定是否可编辑元素的内容。
contextmenu(h5) 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单
data-*(h5) 用于存储页面的自定义数据
dir 设置元素中内容的文本方向。
draggable(h5) 指定某个元素是否可以拖动
dropzone(h5) 指定是否将数据复制,移动,或链接,或删除
hidden(h5) hidden 属性规定对元素进行隐藏。
id 规定元素的唯一 id
lang 设置元素中内容的语言代码。
spellcheck(h5) 检测元素是否拼写错误
style 规定元素的行内样式(inline style)
tabindex 设置元素的 Tab 键控制次序。
title 规定元素的额外信息(可在工具提示中显示)
translate(h5) 指定是否一个元素的值在页面载入时是否需要翻译

@freezebreze
Copy link

accesskey 规定激活元素的快捷键
class
contenteditable 规定元素是否可编辑
data-*
dir 规定元素的文本方向
draggable 规定元素是否可拖拽
hidden 规定元素隐藏
id
lang 规定元素内容的语言
spellcheck 对元素拼写检查
style 内联样式
tabindex 规定元素的tab键序
title 规定元素的额外信息

@buuug7
Copy link

buuug7 commented Jan 8, 2021

全局属性是所有HTML元素共有的属性,它们可以用于所有元素。下面写几个常见的HTML元素通用属性,如果要查看完整的列表,MDN 全局属性列表 上面有。

常用HTML元素共有属性

  • id,
  • class
  • title
  • style
  • data-*(h5)

@xiezhenghua123
Copy link

id
class
href
data
style
accesskey
contenteditable
dir
draggable
hidden
lang
title

@mono2048
Copy link

全局属性:用于任何HTML5元素的属性

accesskey:设置快捷键
class:为元素设置类标识
contenteditable:指定元素内容是否可编辑
contextmenu:自定义鼠标右键弹出上下文菜单内容(仅firefox支持)
data-*:为元素增加自定义属性
dir:设置元素文本方向(默认ltr;rtl)
draggable:设置元素是否可拖拽
dropzone:设置元素拖放类型(copy|move|link,H5新属性,主流均不支持)
hidden:规定元素仍未或不在相关
id:元素id,文档内唯一
lang:元素内容的语言
spellcheck:是否启动拼写和语法检查
style:行内css样式
tabindex:设置元素可以获得焦点,通过tab导航
title:规定元素有关的额外信息
translate:元素和子孙节点内容是否需要本地化(均不支持)

@dengyunsheng250
Copy link

id
name
class
lang
accesskey
data
hidden

@amikly
Copy link

amikly commented Oct 21, 2021

全局属性列表

属性名 作用
accesskey 提供了为当前元素生成键盘快捷键的提示
autocapitalize 控制用户的文本输入是否和如何自动大写
class 一个以空格分隔的元素的类名(classes )列表
contenteditable 一个枚举属性(enumerated attribute),表示元素是否可被用户编辑
contextmenu 的id ,作为该元素的上下文菜单(已经不被支持,将从所有浏览器中删除)
data-* 一类自定义数据属性,它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力
dir 一个指示元素中文本方向的枚举属性
draggable 一种枚举属性,指示是否可以 使用 Drag and Drop API (en-US) 拖动元素
dropzone 枚举属性,指示可以使用 Drag and Drop API 在元素上删除哪些类型的内容
exportparts Used to transitively export shadow parts from a nested shadow tree into a containing light tree
hidden 布尔属性表示该元素尚未或不再相关,不得使用此属性隐藏可合法显示的内容
id 定义唯一标识符(ID),该标识符在整个文档中必须是唯一的
inputmode 向浏览器提供有关在编辑此元素或其内容时要使用的虚拟键盘配置类型的提示
is 允许您指定标准HTML元素应该像已注册的自定义内置元素一样
itemid 项的唯一全局标识符
itemprop 用于向项添加属性
itemref 只有不是具有itemscope属性的元素的后代,它的属性才可以与使用itemref项目相关联
itemscope itemscope(通常)与itemtype一起使用,以指定包含在关于特定项目代码块中的HTML
itemtype 指定将用于在数据结构中定义itemprops(项属性)的词汇表的URL
lang 帮助定义元素的语言:不可编辑元素所在的语言,或者应该由用户编写的可编辑元素的语言
part 元素的部件名称的空格分隔列表
slot 将shadow DOM阴影关联树中的一个沟槽分配给一个元素
spellcheck 枚举属性定义是否可以检查元素是否存在拼写错误
style 含要应用于元素的CSS样式声明
tabindex 整数属性,指示元素是否可以获取输入焦点(可聚焦),是否应该参与顺序键盘导航,如果是,则表示哪个位置
title 包含表示与其所属元素相关信息的文本
translate 枚举属性,用于指定在页面本地化时是否转换元素的属性值及其Text 节点子节点的值,或者是否保持它们不变

@tk12138
Copy link

tk12138 commented Nov 4, 2021

① accesskey:规定激活元素的快捷键
② class:规定元素的一个或多个类名
③ contenteditable:规定元素内容是否可编辑
④ contentmenu:规定元素的上下文菜单。上下文菜单在用户点击时显示
⑤ dir:规定元素中内容的文本方向
⑥ draggable:规定元素是否可拖动
⑦ id:规定元素唯一的id
⑧ style:规定元素的行内CSS样式
title:规定元素的额外信息

@baiye0
Copy link

baiye0 commented Dec 30, 2021

accesskey:设置快捷键
class:为元素设置类标识
contenteditable:指定元素内容是否可编辑
contextmenu:自定义鼠标右键弹出上下文菜单内容(仅firefox支持)
data-*:为元素增加自定义属性
dir:设置元素文本方向(默认ltr;rtl)
draggable:设置元素是否可拖拽
dropzone:设置元素拖放类型(copy|move|link,H5新属性,主流均不支持)
hidden:规定元素仍未或不在相关
id:元素id,文档内唯一
lang:元素内容的语言
spellcheck:是否启动拼写和语法检查
style:行内css样式
tabindex:设置元素可以获得焦点,通过tab导航
title:规定元素有关的额外信息
translate:元素和子孙节点内容是否需要本地化(均不支持)

@syfine
Copy link

syfine commented Apr 11, 2022

属性 描述
accesskey 规定激活元素的快捷键
class 规定元素的一个或者多个类名
contenteditable |规定元素是否可编辑
contextmenu | 规定元素的上下文菜单。上下文菜单在用户点击元素时显示
data-* | 用于储存页面或者应用的私有定制数据
dir 指定元素中内容的文本方向
draggable 制定元素是否可拖动
dragzone 规定在拖动被拖动数据时是都进行复制、移动或链接
hidden 规定元素仍未或者不再相关
id 规定元素的唯一id|
lang 规定元素内容的语言
spellcheck 规定是否对元素进行拼写和语法检查
style 规定元素的行内css样式
tabindex 规定元素的tab键次序
titile 规定有关元素的额外信息
translate 规定是否应该翻译元素内容

@z-m-c
Copy link

z-m-c commented Apr 20, 2022

  1. accesskey 设置访问元素的键盘快捷键。

  2. class 规定元素的类名(classname)

  3. contenteditableNew 规定是否可编辑元素的内容。

  4. contextmenuNew 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单

  5. data-*New 用于存储页面的自定义数据

  6. dir 设置元素中内容的文本方向。

  7. draggableNew 指定某个元素是否可以拖动

  8. dropzoneNew 指定是否将数据复制,移动,或链接,或删除

  9. hiddenNew hidden 属性规定对元素进行隐藏。

  10. id 规定元素的唯一 id

  11. lang 设置元素中内容的语言代码。

  12. spellcheckNew 检测元素是否拼写错误

  13. style 规定元素的行内样式(inline style)

  14. tabindex 设置元素的 Tab 键控制次序。

  15. title 规定元素的额外信息(可在工具提示中显示)

  16. translateNew 指定是否一个元素的值在页面载入时是否需要翻译

@xiaoxiaozhiya
Copy link

全局属性是所有标签都有的属性:

  1. style设置样式

  2. class 可以通过类选择器

  3. dir设置文本的方向

  4. hidden设置隐藏
    5.title 标题

  5. data-*属性选择器

  6. draggable

  7. lang

@WangXi01
Copy link

id,class,type,data,href,label,for,src,width,height,target

@wl2282589971
Copy link

accesskey 设置访问元素的键盘快捷键。
class 规定元素的类名(classname)
contenteditableNew 规定是否可编辑元素的内容。
contextmenuNew 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单
data-*New 用于存储页面的自定义数据
dir 设置元素中内容的文本方向。
draggableNew 指定某个元素是否可以拖动
dropzoneNew 指定是否将数据复制,移动,或链接,或删除
hiddenNew hidden 属性规定对元素进行隐藏。
id 规定元素的唯一 id
lang 设置元素中内容的语言代码。
spellcheckNew 检测元素是否拼写错误
style 规定元素的行内样式(inline style)
tabindex 设置元素的 Tab 键控制次序。
title 规定元素的额外信息(可在工具提示中显示)
translateNew 指定是否一个元素的值在页面载入时是否需要翻译

@Iambecauseyouare
Copy link

accesskey:生成键盘快捷键
autocapitalize:控制用户的文本输入是否和如何自动大写
class:元素的类名
contenteditable:表示元素是否可被用户编辑
data-*自定义数据类型
dir:指示元素中文本方向
draggable:指示是否可以使用drag and drop api拖动元素
dropzone:指示可以使用drag and drop api在元素上删除哪些类类型的内容
hidden:布尔属性表示该元素尚未或不再相关
id:定义唯一标识符
inputmode:向浏览器提供有关在编辑此元素或其内容时要使用的虚拟键盘配置类型的提示
is:运输您指定标准HTML元素应该像已注册的自定义内置元素一样
itemid:项的唯一全局标识符
itemprop:用于向项添加属性
itemscope:通常与itemtype一起使用,以指定包含在关于特定项目代码块中的HTML
itemtype:指定将用于在数据结构中定义itemprop(项属性)的词汇表的URL
lang:帮助定义元素的语言
part:元素的部件名称的空格分隔列表
::part():伪元素选择和设置阴影关联树中的特定元素
slot:将shadow DOM阴影关联树中的一个沟槽分配给一个元素
spellcheck:枚举属性定义是否可以检测元素是否存在拼写错误
style:含要应用与元素的CSS样式声明
tabindex:整数属性,指示元素是否可以获取输入焦点(可聚焦),是否应该参与顺序键盘导航,如果是,则表示哪个位置
title:包含表示与其所属元素相关信息的文本
translate:枚举属性,用于指定在页面本地化时是否转换元素的属性值及其text节点子节点的值,或者是否保持它们不变

@keenesun
Copy link

  1. 事件,例:onclick
  2. class/id
  3. draggable
  4. dir
  5. accesskey
  6. autofocus
  7. slot
  8. contenteditable
  9. data-*
    10 title

@lili-0923
Copy link

accesskey 设置访问元素的键盘快捷键。
class 规定元素的类名(classname)
contenteditableNew 规定是否可编辑元素的内容。
contextmenuNew 指定一个元素的上下文菜单。当用户右击该元素,出现上下文菜单
data-*New 用于存储页面的自定义数据
dir 设置元素中内容的文本方向。
draggableNew 指定某个元素是否可以拖动
dropzoneNew 指定是否将数据复制,移动,或链接,或删除
hiddenNew hidden 属性规定对元素进行隐藏。
id 规定元素的唯一 id
lang 设置元素中内容的语言代码。
spellcheckNew 检测元素是否拼写错误
style 规定元素的行内样式(inline style)
tabindex 设置元素的 Tab 键控制次序。
title 规定元素的额外信息(可在工具提示中显示)
translateNew 指定是否一个元素的值在页面载入时是否需要翻译

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
html html
Projects
None yet
Development

No branches or pull requests