<div role="document">是HTML5中一個用來標記Web頁面的角色（role）的屬性。它的作用是將具有文檔內容的元素標記為頁面的主要內容，從而幫助輔助技術更好地理解文檔的結構和內容。在本文中，我們將通過幾個代碼案例來詳細解釋<div role="document">的使用。
，我們來看一個簡單的例子。假設我們有一個包含多個部分的頁面，其中每個部分都有自己的標題和內容。我們可以使用<div role="document">來將整個頁面的主要內容包裹起來，示例代碼如下：

<div role="document">
<h1>頁面標題</h1>
<div>
<h2>部分1</h2>
<p>部分1的內容</p>
</div>
<div>
<h2>部分2</h2>
<p>部分2的內容</p>
</div>
</div>

在上面的代碼中，我們使用<div role="document">將整個頁面的主要內容包裹起來，并通過嵌套的<div>元素劃分了各個部分，每個部分都有自己的標題和內容。這樣一來，輔助技術就能夠更好地理解頁面的結構和內容。
接下來，我們來看一個更復雜的案例。假設我們有一個帶有導航欄和正文內容的頁面，我們希望通過<div role="document">將正文內容標記為頁面的主要內容。示例代碼如下：

<div role="document">
<nav>
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">關于我們</a></li>
</ul>
</nav>
<div>
<h1>頁面標題</h1>
<p>頁面內容</p>
</div>
</div>

在上面的代碼中，我們使用<div role="document">將頁面的正文內容標記為主要內容，并將導航欄部分的代碼放在<div role="document">之外。這樣一來，輔助技術就能夠更好地識別主要內容，并且可以跳過導航欄等非主要內容，直接定位到正文內容。
一下，<div role="document">是HTML5中的一個角色屬性，用于標記Web頁面的主要內容。通過將<div role="document">包裹頁面的主要內容，我們可以幫助輔助技術更好地理解頁面的結構和內容。無論是簡單的頁面還是復雜的頁面，我們都可以通過合適地使用<div role="document">來提升頁面的可訪問性和用戶體驗。