gpt4 book ai didi

javascript - 如何在不渲染的情况下将制表符(\t)等特殊字符显示为网页上的文本?

转载 作者:太空宇宙 更新时间:2023-11-04 06:43:59 25 4
gpt4 key购买 nike

使用 javascript 将“\t”插入到 div 中后,无法在网页上显示“\t”。

看看下面的代码片段。第一个 div 将“\t”显示为文本,但当使用 javascript 将它们插入 div 时,它们会被浏览器呈现,而不是在 UI 上显示为文本。

我需要使用 javascript 在 div 中插入文本,文本包含“\t”字符,我需要按原样显示它们,而不是渲染它。

我在 stackoverflow 上看了很多类似的问题,但没有一个真正有效。请指教。

function callme() {
document.getElementById('div2').innerHTML = "I am div 2, tab char 1:\t , tab char 2: \t";
}
<!DOCTYPE html>
<html>
<body>
<span id='div1'>I am div 1, tab char 1: \t , tab char 2: \t</span>
<br /> <br /> <br />
<button onclick="callme()">Click me to Insert tab characters in below div</button>
<br /> <br />
<span id='div2'>I am div 2, click above button insert tab characters</span>
</body>

</html>

最佳答案

只需转义 \带有 \\ 的字符.


顺便说一句(仅供引用):

  • 不要为自终止标签 (<br />) 而烦恼。它们对您没有任何好处,并可能导致代码中出现错误。您可以阅读更多相关信息 here .

  • <br>不应用于在文档布局中插入空格。它应该只用于将部分内容放在下一行。所有布局都应由 CSS 处理。

  • 不要使用内联 HTML 事件属性 ( onclick ) 作为 there are many reasons不要使用这种 25 岁以上的技术,它不会死于应有的死亡。相反,遵循现代的、基于标准的 element.addEventListener() API。

let output = document.getElementById('div2');
document.querySelector("button").addEventListener("click", callme);

function callme() {
output.innerHTML = "I am div 2, tab char 1:\\t , tab char 2: \\t";
}
/* All layout should be done with CSS */
div { margin:2em 0; }
<div id='div1'>I am div 1, tab char 1: \t , tab char 2: \t</div>
<button>Click me to Insert tab characters in below div</button>
<div id='div2'>I am div 2, click above button insert tab characters</div>

关于javascript - 如何在不渲染的情况下将制表符(\t)等特殊字符显示为网页上的文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53461191/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com