jQuery解析HTML意外和错误

所以我有一个非jQuery解决这个问题，但我宁愿使用jQuery，如果有一种方式，我也很好奇，为什么发生这种情况。jQuery解析HTML意外和错误

我有一个Facebook的iframe应用程序，我使用Facebox在页面弹出窗口中动态加载一些XFBML。

现在我加载的XFBML恰好是fb:serverfbml标签，它创建一个指向Facebook的iframe并呈现FBML。这意味着我需要动态添加FBML，然后在显示弹出窗口后重新解析XFBML。所以，我有如下所示的代码：

var App = {}; 

App.inviteFBML = '\ 
<fb:serverfbml style="width: 300px; height: 225px;"> \ 
    <script type="text/fbml"> \ 
     <fb:fbml> \ 
     </fb:fbml>\ 
    </script>\ 
</fb:serverfbml>'; 

App.inviteFBMLHolder = "<div id='invite_holder' style='width: 300px; height: 250px;'></div>"; 

App.showInvitePrompt = function(){ 
    $.facebox(App.inviteFBMLHolder); 
    document.getElementById('invite_holder').innerHTML = App.inviteFBML; 
    FB.XFBML.Host.parseDomElement(document.getElementById('facebox')); 
};

现在，上面的代码工作，但是请注意，我用

document.getElementById('invite_holder').innerHTML

而不是

$('#invite_holder').html();

如果我使用jQuery的.html功能它在插入之前实际上重新构造了我的HTML。它是重构以下：

<fb:serverfbml style="width: 300px; height: 225px;"> 
</fb:serverfbml> 
<script type="text/fbml"> 
    <fb:fbml> 
    </fb:fbml> 
</script>

我认为它是这样做的，因为它包含非标准的标签，但没有任何办法有jQuery的插入之前没有重新格式化我的字符串？

来源

2009-10-05 jtymann

有人可能想要重命名标题，因为它不是HTML被错误地解析，而是一个专有的Facebook格式。 – ironsam 2009-12-31 23:07:58

...但它*被错误地解析... FBML实现的一部分涉及向元素添加一个xmlns：fbml声明，所以它是有效的。 – 2010-01-01 06:18:49

是否将一个xml名称空间添加到一个html文档中，然后使用来自所述xml名称空间的xml标签使这些标签有效的html？当然这个东西不会被验证。 – ironsam 2010-01-01 23:58:49

正如您使用FB.XFBML.Host.parseDomElement(document.getElementById('facebox'));解析添加的html。我冒着猜测功能应该寻找简单的文本。你可以尝试添加的东西作为文本而不是HTML使用jQuery，如：

$('#invite_holder').text(App.inviteFBML);

来源

2009-10-05 17:29:34 TheVillageIdiot

不错的尝试，但是使用.text会转义任何通常应该在文本中转义的html字符。因此，而不是得到呈现能够xfbml，我得到我的html的文本版本 – jtymann 2009-10-05 17:40:19

： - /这是如此糟糕..... – TheVillageIdiot 2009-10-05 18:40:13

我在做类似的东西，就用jQuery相同的问题重新安排我的代码，但我可以避过它通过执行以下操作：

<fb:serverfbml id="fbml"> 
</fb:serverfbml> 

<script type="text/javascript"> 
function populateInviteFbml() { 
    $('#fbml').load('/getinvitefbml', null, renderInvite); // gets the FBML from <script type="text/fbml"> on in 
} 

function renderInvite() { 
    FB_RequireFeatures(['XFBML'], function() { 
     FB.Facebook.init('abcdabcdabcdabcd', '/xd_receiver.htm'); 
      }); 
} 
</script>

来源

2009-12-30 22:50:12

看起来jQuery是宽松得多了<script>标签内部创造了什么与什么正常的HTML标记不是在一个脚本块。你可以用一个id首先创建外非HTML标签，然后附加到：

$(".inner").append("<fb:serverfbml id='someID' style='width:300px; height: 225px;'>"); 
$("#someID").append("<script type='text\fbml'><fb:fbml></fb:fbml></script>");

来源

2009-12-31 23:04:48 ironsam

或者是jQuery的HTML解析器，食堂的事情了。所以，如果你手动设置innerHTML它会正常工作。

所以，你可以加载在所有使用：

$.ajax({ 
    type:"GET", 
    url: "/my/url", 
    datatype: 'text', 
    success: function(html) { 
    var ele = $('myselector')[0]; 
    ele.innerHTML = html; 
    FB.XFBML.Host.parseDomElement(ele); 
    } 
});

唯一的问题与此是没有的JavaScript代码包含在HTML将在插入时运行。

来源

2010-02-19 22:59:55 Tal

谢谢，有同样的问题，并且这固定它。这应该是被接受的答案！ – 2011-02-07 23:21:35

jQuery解析HTML意外和错误

回答

相关问题