如何在 JavaScript 中將 HTML 字串轉換為 DOM 元素？

從 HTML 字串建立 DOM 元素

在 JavaScript 中，有時需要將 HTML 字串轉換為其對應的 DOM 元素。這是動態建立和操作頁面內容的基本操作，例如將元素附加到文件時。

要完成此任務，您可以使用 DOMParser。使用 DOMParser 的語法是：

const doc = new DOMParser().parseFromString(htmlString, "text/xml");

這裡，htmlString 表示您要轉換的 HTML 程式碼，doc 是包含解析的 DOM 元素的結果文件。

例如，考慮以下HTML 字串：

<div>
    <a href="#"></a>
    <span></span>
</div>

使用DOMParser，您可以將此字串轉換為DOM元素如下：

const htmlString = "
";
const doc = new DOMParser().parseFromString(htmlString, "text/xml");

doc 物件現在將解析的HTML 作為DOM元素保存，可以使用諸如appendChild()之類的方法將其附加到頁面：

const parentElement = document.getElementById('parent');
parentElement.appendChild(doc.firstChild);

This會將解析後的 H​​TML 內容添加為實際 DOM 中的parentElement 的子元素。請注意，DOMParser 解釋 XHTML 樣式的 HTML，這需要結束標記，如上面的範例所示。

以上是如何在 JavaScript 中將 HTML 字串轉換為 DOM 元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！