HTML5強制兩個單獨元素之間的關係

Question

我正在嘗試使用HTML5s最佳做法，但存在以下兩難局面。我有一系列相互關聯的圖像和文本，但由於應用了jQuery轉換來循環它們，所以我不得不將圖像與其相符的文本分開。因此，而不是非常期待這樣的：

<article> 
    <img src="image1.png"> 
    <h1>Title1</h1> 
    <p>Description</p> 
</article> 
<article> 
    <img src="image2.png"> 
    <h1>Title2</h1> 
    <p>Description</p> 
</article> 

相反，它看起來是這樣的：

<div id="textholder"> 
    <article> 
     <h1>Title1</h1> 
     <p>Description</p> 
    </article> 
    <article> 
     <h1>Title2</h1> 
     <p>Description</p> 
    </article> 
</div> 
<div id="images"> 
    <article> 
     <h1>Title1</h1> 
    </article> 
    <article> 
     <h1>Title2</h1> 
    </article> 
</div> 

這顯然是不理想的，因爲現在有圖像和文本之間沒有任何關係。我通過HTML5 outliner (h5o)來衡量這種關係。有沒有鏈接到分隔標籤之間的關係的方法？

Answer 1

否。重寫jQuery腳本，您的原始HTML是在語義上正確的方式。