通过<p>标签

Disable auto-trimming of text by <p> tag

本文关键字:标签 gt 通过 lt      更新时间:2023-09-26

我在一个变量var text = " Hell O "中有一些文本。文本的每个字符都被包装在span标记中,给定一个id,然后附加到p标记的innerhtml中。然后通过一个函数,对每个跨度进行样式化(针对一个事件)。

问题是p标记开头或结尾的任何空格都不会高亮显示。我不确定p标签是否忽略了空格,而没有将它们包含在最后一段中。但似乎第一个/最后一个空格没有被包括在内。

这是我的造型功能顺便说一下

function highlightLetter(typedletter) {
        var targetId = "h"+( typedletter );
        makeGreen = document.getElementById(targetId) ;
        if (makeGreen) {
            console.log(makeGreen.innerText.charCodeAt(0)) ;
            if (makeGreen.innerText.indexOf(String.fromCharCode(10)) == -1 ) {
                makeGreen.style.background  = "lightgreen" ;
            }
        }
    }

有什么想法吗?

感谢

段落开头和结尾的空白处不会呈现。此外,段落中的空格序列也被折叠。

如果希望渲染所有空白,请使用不间断空间实体&nbsp;。请注意,这将影响换行,并可能在换行的地方引发水平滚动。

您可以将所有普通的空白字符替换为不间断的空格,如下所示:

var text = " Hell O ";
text.replace(/ /g, "&nbsp;");

或者,您也可以使用<pre>...</pre>标记。