Question

我想我有一个非常简单的问题，但我找不到解决方案。所以我想要的是通过HTML加载DIV内容。问题是它不仅仅是一个文本，还有一个图像。 ajax调用返回HTML代码，但它在DIV中显示为HTML并且不会执行。难以解释，但从示例中可以看出...... AJAX调用返回字符串：

<img src="/images/weather/1.png" width="80px"><br>3.3 °C

问题很明显。而不是图像和div中的3.3°C，我得到的是实际的代码，所以我看到img src = ....而不是图像。

我知道我需要以某种方式解码HTML，但我不知道如何做到这一点，非常感谢任何帮助。

我的Javascript代码是：

var xmlhttp;
if (window.XMLHttpRequest) {
    // code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp = new XMLHttpRequest();
} else {
    // code for IE6, IE5
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        newtext = xmlhttp.responseText;
    }
}
xmlhttp.open("GET", "message_ajax.php", true);
xmlhttp.send();
$('#text').fadeOut(function () {
    $(this).text(newtext).fadeIn();
})

Answer 1

你正在寻找这样的东西吗？ https://api.jquery.com/load/

您可以使用ajax将HTML加载到DIV中。似乎是你在问什么...

$( "#result" ).load( "ajax/test.html" );

您的ajax / test.html文件包含

的位置

<img src="/images/weather/1.png" width="80px">

编辑...更具体。这是使用jQuery。

Answer 2

您应该使用$(this).html(newtext)代替$(this).text(newtext)。

他们完全不同。 .text()将“转义”您的HTML并将其作为简单文本插入。或者如文档所述：

我们需要知道此方法会转义提供的字符串必要的，以便它在HTML中正确呈现。为此，它打电话 DOM方法.createTextNode（）不会将字符串解释为 HTML。

您应该首先阅读文档。

如果你已经在使用jQuery，你可以使用它AJAX methods，这会让你的生活更轻松。

Answer 3

document.getElementById("divId").innerHTML = "<img ..........";

OR

$("#divId").html("<img ..........");

通过ajax将DIV内容加载为HTML

3 个答案: