HTML全局屬性是所有元素通用的配置項，用於控制行為、樣式等。 1. 常用屬性包括class（設置類名）、id（唯一標識）、style（內聯(lián)樣式）、title（提示信息）、lang/dir（語言方向）、tabindex（焦點控制）、hidden（隱藏元素）。 2. data-*屬性用於存儲自定義數(shù)據(jù)，如data-product-id，可通過JavaScript的dataset讀取。 3. ARIA屬性如aria-label、role提升無障礙體驗。 4. 事件處理屬性如onclick、onload推薦使用addEventListener綁定以分離結構與行為。

HTML 全局屬性（Global Attributes）是可以在所有HTML 元素中使用的屬性。它們不局限於某個特定標籤，而是通用的配置項，用來控制元素的行為、樣式、交互等。理解這些屬性有助於寫出更靈活和語義化的網(wǎng)頁結構。

1. 常用全局屬性

下面是一些最常被使用到的全局屬性：

• class ：用於為元素指定一個或多個類名，便於CSS 或JavaScript 操作。
• id ：唯一標識一個元素，在頁面中必須唯一，常用於錨點跳轉或JS 控制。
• style ：直接為元素添加內聯(lián)樣式，雖然方便但不推薦頻繁使用。
• title ：當鼠標懸停在元素上時顯示的提示信息。
• lang和dir ：用於設置語言和文本方向，對國際化和可訪問性很重要。
• tabindex ：控制元素是否可以通過Tab 鍵獲得焦點，以及其聚焦順序。
• hidden ：布爾屬性，表示該元素是否應該被隱藏，瀏覽器不會渲染它。

這些屬性幾乎可以加在任何HTML 標籤上，比如<div> 、 <code><span></span> 、 <p></p> 、甚至和 。

2. 數(shù)據(jù)屬性data-*

data-*屬性是一個非常實用的全局屬性類別，允許你在HTML 元素中存儲自定義數(shù)據(jù)。例如：

 <div data-product-id="123" data-category="electronics">商品信息</div>

JavaScript 可以通過dataset對象來讀取這些值：

 const div = document.querySelector('div');
console.log(div.dataset.productId); // 輸出: 123

這種方式非常適合在前端傳遞一些輕量級的數(shù)據(jù)，不需要額外的AJAX 請求。

3. 可訪問性相關屬性（ARIA）

HTML 支持ARIA（Accessible Rich Internet Applications）屬性來增強無障礙體驗，常見的包括：

• aria-label ：為元素提供可訪問的名稱，適用於屏幕閱讀器。
• aria-describedby和aria-labelledby ：關聯(lián)描述文本，幫助用戶理解控件用途。
• role ：定義元素的角色，如按鈕、菜單、導航欄等。

例如：

 <button aria-label="關閉窗口">×</button>

這些屬性雖然不是強制性的，但在構建對殘障人士友好的網(wǎng)站時非常重要。

4. 事件處理屬性（如onclick、onload 等）

HTML 還支持一些全局事件屬性，例如：

• onclick
• onload
• onmouseover
• onchange

雖然可以直接寫在HTML 中，但更推薦的做法是使用JavaScript 的addEventListener來綁定事件，這樣可以保持結構與行為分離。

例如：

 <button onclick="alert(&#39;點擊了按鈕&#39;)">點我</button>

更好的做法：

 <button id="myButton">點我</button>

<script>
  document.getElementById(&#39;myButton&#39;).addEventListener(&#39;click&#39;, function() {
    alert(&#39;點擊了按鈕&#39;);
  });
</script>

基本上就這些。全局屬性看似簡單，但用好了能大大提升網(wǎng)頁的可用性和開發(fā)效率。