如何使用.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>';