怎么在title里显示原代码而不被解析
这里是部分代码<div id="dad1">
<div id="baby1">X</div>
<h1>广告</h1>
</div>
</div>
<script>
const baby1 = document.querySelector("#baby1")
baby1.addEventListener("click", function () {
baby1.parentNode.style.display = "none"
})
baby1.onmouseover = function () {
this.title = this.innerHTML
}
</script>
我想悬停在baby1元素上时显示其节点的所有代码。试过innerTEXT，也是只显示文本。 要在title中显示元素的原始代码，可以使用innerText属性，但是需要进行一些调整。innerText属性会将元素及其子元素的文本内容作为一个字符串返回。
在你的代码中，你使用了innerText，但是你只能得到元素的文本内容，因此无法获取元素的 HTML 代码。要获取整个元素的原始 HTML 代码，你可以使用outerHTML属性。
下面是修改后的代码示例：
const baby1 = document.querySelector("#baby1");
baby1.addEventListener("click", function () {
baby1.parentNode.style.display = "none";
});
baby1.onmouseover = function () {
this.title = this.outerHTML; // 将元素的原始 HTML 代码赋值给title
};
现在，当你悬停在baby1元素上时，title将显示该元素的完整HTML代码。注意，在HTML代码中可能包含特殊字符（如尖括号"<"和">"），所以在显示之前，浏览器会将这些字符进行转义。
以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。 FishC 发表于 2024-2-11 09:25
要在title中显示元素的原始代码，可以使用innerText属性，但是需要进行一些调整。innerText属性会将元素及 ...
那我怎么给页面内所有元素都添加这个效果呢 Sorawithcat 发表于 2024-02-11 09:50
那我怎么给页面内所有元素都添加这个效果呢
要给页面内所有元素都添加这个效果，你需要遍历整个文档中的所有元素，并为每个元素添加相应的事件处理程序。下面是一个示例代码：const elements = document.body.getElementsByTagName("*"); // 获取页面内所有元素for (let i = 0; i < elements.length; i++) { const element = elements; element.onmouseover = function () { this.title = this.outerHTML; // 在悬停时显示元素的原始 HTML 代码 };}在这个代码中，我们使用document.body.getElementsByTagName("*")获取页面内所有的元素，然后使用循环遍历每个元素，并为其添加onmouseover事件。在事件处理程序中，我们将元素的outerHTML赋值给title属性，这样在悬停时就可以显示元素的原始 HTML 代码了。请注意，这会给页面中的每个元素都添加事件处理程序，如果页面非常大，可能会导致性能问题，所以在实际应用中需要根据需要进行适当的优化。
以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
页:
[1]