jQuery parseHTML无法按预期工作

Question

我正在从jsonp调用中获取json数据。数据恢复正常。一个数据元素采用字符串形式，其中包含一些html（“ p”标记，“ a”标记）。我正在尝试在jQuery对话框中输出此元素（图片描述）。由于某种原因，无论是否使用$ .parseHTML，我都无法将其呈现为html。

程式码片段：

var image       = data.image;
var title       = data.title;
var id          = data.id;
var description = $.parseHTML( data.description );
var media       = data.media;
var secret      = data.secret;
if(media == "photo"){
    var string  = "<div id=\"picturebox\" class=\"picturebox\">\n";
    string += "    <img src=\""+image + "\" id=\"photo_"+id+"\" />\n";
    string += "    <h2>" + title + "</h2>\n";
    string += "    <p>" + description + "</p>\n";
    string += "</div>\n";
    $('#gbFullPic').html(string);
}

尽管动态生成的div正确显示，包括图像和标题，但“描述”行输出如下：[object Text]

如果删除$ .parseHTML，输出将如下所示：

Bird of paradise growing in south Florida.<p><a href="http://www.popgnology.com/guestbook.php">ACME Adventures</a></p>

如果我的html输出未显示实际的html标签，那当然可以。我究竟做错了什么？

更新（第二修订版）：我以前的解决方案不完整。该问题比单个jquery或javascript解决方案更为复杂。

问题开始于服务器端，格式错误的html是通过以下方式发送的

header('content-type: application/json; charset=utf-8');
echo $cid . '('.json_encode($data).')';

• 在服务器端（PHP），我必须对我的“描述”项进行条件处理（例如，注意htmlspecialchars_decode的添加和一个adslashes包装器）：

    if($k == "description"){ 
      $data["$k"] = addslashes(htmlspecialchars_decode($v));
    }
    else{
      $data["$k"] = $v;
    }
  

• 然后，此javascript正确呈现json数据项：

  var description   = data.description.replace('\\','');
  

通过两步过程来更正服务器页面上的传递格式，并在客户端使用.replace去除斜杠，“描述”可以正确显示html页面上的所有文本和html元素。

Answer 1

尝试var description = $($.parseHTML(data.description)).html();

jQuery 的parseHTML返回 DOM 节点数组。然后你可以将它们插入到 DOM 中，但在你的情况下，你应该获取它们.html()并将其添加到你的字符串中。

Answer 2

我的猜测是您的data.description被转义，而parseHTML方法将无法处理该问题。查看此帖子以获取解决方案：

JavaScript解码HTML实体

var text = '<p>name</p><p><span style="font-size:xx-small;">ajde</span></p><p><em>da</em></p>';
var decoded = $('<div/>').html(text).text();
alert(decoded);

因此，在您的情况下：

var decoded = $('<div/>').html(data.description).text();
$('#gbFullPic').html(decoded);