HTML | DOM 初始属性

HTML (HyperText Markup Language) 是用来定义和组织 Web 内容的语言。文档对象模型 (Document Object Model，简称 DOM) 则是用来操作 HTML 文档的 API。

在使用 DOM 操作 HTML 文档的过程中，我们经常需要获取或设置 HTML 元素的属性。本文介绍一些常用的 HTML 元素属性及其作用。

id

id 属性用来定义 HTML 元素的唯一标识符。通过 getElementById() 方法可以获取拥有指定 id 的 HTML 元素。

var element = document.getElementById("myElement");

class

class 属性用来定义 HTML 元素的类名。可以通过 getElementsByClassName() 方法获取拥有指定类名的 HTML 元素集合。

var elements = document.getElementsByClassName("myClass");

style

style 属性用来设置 HTML 元素的样式。可以使用 dot 语法或者 [] 语法来访问元素的样式属性。

element.style.color = "red";
element.style["font-size"] = "16px";

title

title 属性用来设置 HTML 元素的标题。当鼠标悬停在元素上时，会显示出该标题。

<p title="This is a paragraph.">Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>

lang

lang 属性用来定义 HTML 元素的语言。对于搜索引擎和屏幕阅读器来说，这个属性非常重要。

<div lang="zh-CN">
  <p>你好，世界！</p>
</div>

dir

dir 属性用来定义 HTML 元素的文本方向。值可以是 ltr (left-to-right，从左到右) 或者 rtl (right-to-left，从右到左)。

<div dir="rtl">
  <p>مرحبا بالعالم!</p>
</div>

tabindex

tabindex 属性用来定义 HTML 元素的 Tab 键顺序。通常情况下，Tab 键的顺序是按照文档流从上到下从左到右的顺序。

<button tabindex="1">Button 1</button>
<button tabindex="2">Button 2</button>
<button tabindex="3">Button 3</button>

contenteditable

contenteditable 属性用来使 HTML 元素可编辑。可以被赋值为 true 或者 false。

<div contenteditable="true">
  <p>This is a paragraph.</p>
</div>

以上是一些常用的 HTML 元素属性及其作用。通过这些属性，可以方便地操作和控制 HTML 页面。