如何解析来自JSON对象的HTML标记

我有一个json对象，它具有带样式的html值。我试着在我的html中使用jquery append。如何解析来自JSON对象的HTML标记

该值正在追加，但它没有转换成正常的DOM，它将整个事件作为字符串追加。

这是我的JSON对象的值：

var obj = { 
    content : "<p>&lt;linkrel=&quot;stylesheet&quot;type=&quot;text/css&quot;href=&quot;http:<p>&lt;styletype=&quot;text/css&quot;&gt;<br/>.wrap{<br/>&nbsp;&nbsp;background-color:#F6F6F6;<br/>}<br/>&lt;/style&gt;</p><p>&lt;divclass=&quot;wrap&quot;&gt;<br/> &lt;/div&gt;</p>" 
}

这是我的尝试：

HTML：

<div id='container'></div>

JS：

$('#container').append(obj.content);

Demo

输出应该是dom的一部分，而不是将整个东西打印为字符串。

来源

2016-03-01 M-S

你可以做这样的事情......

var obj = { 
    content : '<p>&lt;style&gt;.wrap{color:red}&lt;/style&gt;&lt;div class="wrap"&gt;aa&lt;/div&gt;</p>' 
} 

$('span').append($(document.createElement('div')).html(obj.content).text());

小提琴手：https://jsfiddle.net/suscmguy/

你obj.content似乎已经无效/不完整的编码

希望这有助于...

来源

2016-03-01 06:31:31

欢迎！快乐编码...;） –

你可以尝试这样做的：

$('#container').append($(obj.content));

这应该工作。正如你只是想追加文本而不是DOM元素

另一个变化是响应JSON，因为它有p标签和htmlescaped元素。所以，你可能需要改变响应有点过了，比如，

更改样式表链接到一个style标签，贴在div。
将回复作为未转义发送，这有助于减少混乱。

希望有所帮助！

来源

2016-03-01 06:02:37

尝试过，但没有运气 –

您能否请您提供一个演示示例 –

您可以发布小提琴吗？这是我尝试过的。 https://jsfiddle.net/318e0mx3/ –

你的字符串格式是错误的，因为当我用下面的代码替换你的代码时，它工作得很好

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 

</head> 
<body> 
    <div id='tester'></div> 
    <script > 
     var obj = { 
     content : "<ul><li>coffee</li><li>tea</li></ul>'" 
     }; 

     $('#tester').append(obj.content); 
    </script> 
</body> 
</html>

我的意思是说，你以为你是添加HTML代码，但因为认为它是一个简单的字符串，这就是为什么你看到一个字符串加入你的坏字符串格式化的JavaScript。

来源

2016-03-01 07:05:11 user3671377

如何解析来自JSON对象的HTML标记

回答

相关问题