为什么我的带有html标签的文本没有'当我使用javascript时，它不会正确显示

Why does my text with html tags doesn't show right when I use javascript?

本文关键字：javascript 显示 标签 html 我的 文本 为什么      更新时间：2023-09-26

我有这样的文本：

 <p class="rtejustify">No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>

如果我这样使用它：

<div class="corpo">     
    <p class="rtejustify">No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>

在html页面中正确显示。。。像这样：

没有人会做宣传文学计划，这是欧盟统计局门户网站的一个主题。

但如果我在js函数中获得相同的代码并将其放在变量中，当我打开html文件时，还会显示html标记。。。

示例：单击以测试

var texto= "<p class="rtejustify">No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>";
$(".corpo").text(texto);
         
   
.corpo
{
    background-color:#000066 ;
    opacity: 0.8;
    filter: alpha(opacity=50);
    width:1000px;
    height:380px;
    position:fixed;  
    z-index:3;
    overflow: scroll;
    color:white;      
    font-family:Arial;
    font-size:20px;
    font-style:normal;
    font-weight:bold;
    overflow-y:scroll;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<div class="corpo">     
        <p class="rtejustify">No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>
</div>

不要使用text函数，而是使用html函数。http://api.jquery.com/html/

奇怪的是，我的浏览器对text和html有相同的行为，但基本上，如果你使用的是html：使用html，否则使用text。

在Mac OS X上使用OperaMozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.90 Safari/537.36 OPR/29.0.1795.47这可能是Opera中的一个错误，或者是(有缺陷的(设计。

    var texto= "<p class='rtejustify'>No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>";
$(".corpo").html(texto);

请尝试此代码。。

@Barmar：您应该使用html((而不是text((。您在javascript变量texto中使用了双引号。类名rtejustify应放在单引号之间。

用以下代码替换您的代码。

var texto= "<p class='rtejustify'>No &acirc;mbito do Programa de Literacia Estat&iacute;stica promovido pela Biblioteca, a terceira sess&atilde;o decorrer&aacute; no dia 28, entre as 14h30 e as 17h00, na Sala EC-101 (STI), tendo como recurso estat&iacute;stico o Portal do Eurostat.</p>";
$(".corpo").text(texto);

方法1

指示使用如下javascript直接函数：document.getElemenstByClassName('corpo')[0].innerHTML="your text"

方法2

document.getElemenstByClassName('corpo')[0].appendChild(document.createTextNode("your text"))这个与上面的不同之处在于它打印了所有的标签和所有的东西。

方法3

document.getElemenstByClassName('corpo')[0].innerHTML= document.getElemenstByClassName('corpo')[0].value+ "your text"

这种方式允许我们使用标签。

方法2和方法3分别类似于usingn Jquery $(".corpo").text(texto);和CCD_。(请不要说我不认为这是Jquery的实现(。

这两种方法的区别在于Ist创建了一个Node，这意味着Javascript将所有内容都视为String，它不区分<p>和p，即标记和简单文本，因为innerHTML只是将内容放在元素的双引号之间，因此我们可以利用标记的优势。

这种技术在Firefox中使用。在textarea中，您输入的每一行都作为文本节点放入textarea标记中。您可以在控制台中看到这一点。

参见的工作示例

相关文章：