在 XMLHttpRequest 中保留 HTML 标签答案

【问题标题】：preserve HTML tags in XMLHttpRequest在 XMLHttpRequest 中保留 HTML 标签
【发布时间】：2021-08-30 15:51:58
【问题描述】：

假设 XML 的文本包含 HTML 标记，例如  、 和 。

我可以使用XMLHttpRequest 获取数据并保留这些 HTML 标记吗？

文本.xml

<div>
  <p>Foo bar <br/>foobar <b>bold</b> <i>italic</i></p>
</div>

index.html

<p id="text"></p>

script.js

var request;

function sendInfo() {
    var url = "text.xml";
        request = new XMLHttpRequest();

    try {
        request.onreadystatechange = getInfo;
        request.open("GET", url, true);
        request.send();
    }
    catch (e) {
        alert("Unable to connect to server");
    }
}

function getInfo() {
    if (request.readyState == 4) {
        var val = request.responseText;
        document.getElementById('text').innerHTML = val;
    }
}

sendInfo();

浏览器中的结果：

Foo bar<br/>
foobar bold italic<br/><br/>

  标记似乎被保留，但  和  无效。

Chrome 元素选项卡中的 HTML 如下所示：

<p id="text">
  <div>
    <p>
      "Foo bar "
      <br>
      "foobar "
      <b>bold</b> 
      <i>italic</i>
    </p>
  </div>
</p>

我在正确的轨道上吗？我错过了什么？

【问题讨论】：

为什么你认为和没有被保留？它们位于“元素”选项卡中。
@drake7 嘿，伙计，它似乎工作得很好！没有问题
如果文本不是粗体或斜体，则可能是 CSS 问题。
是的，我可以确认这是一个 CSS 问题。我有一个 reset.css 以某种方式使这些标签无效。我试图了解如何...非常感谢大家指出代码应该可以工作。

标签： javascript xml-parsing xmlhttprequest

【解决方案1】：

问题已解决。正如所指出的，代码有效。

这是一个 CSS 问题。

特别是我的b, u, i { font: inherit } reset.css 在index.html 中（在我的开发环境中）。

一旦我将其注释掉，标签就会按预期应用。

（我没有测试我用于这个问题的简化代码，这很糟糕。）

【讨论】：