如何使用 .innerHTML 添加 html 標簽？

Question

我有一個要更新innerhtml 文本和圖標的元素，但我的標簽被忽略了。

 document.getElementById("nextBtn").innerHTML = "Next
 <i class="icon icon--right icon-arrow-right"></i>";
}

Answer 1

您需要轉義字符串中的內部雙引號" ，或者將外部引號更改為單引號' ; 示例：

document.getElementById("nextBtn").innerHTML = "Next <i class=\"icon icon--right icon-arrow-right\"></i>";

document.getElementById("nextBtn").innerHTML = 'Next <i class="icon icon--right icon-arrow-right"></i>';

Answer 2

您的 HTML 字符串應使用單引號而不是雙引號進行格式化。

目前是：

 document.getElementById("nextBtn").innerHTML = "Next
 <i class="icon icon--right icon-arrow-right"></i>";

改成：

document.getElementById("nextBtn").innerHTML = 'Next<i class = "icon icon--right icon-arrow-right" ></i>';

Answer 3

你必須用單引號代替雙引號

document.getElementById("nextBtn").innerHTML = 'Next<i class = "icon icon--right icon-arrow-right" ></i>';