javascript - jQuery 在复杂的 HTML 字符串中评估 JavaScript

标签 javascript jquery jquery-selectors

这让我发疯......

我想做的是更新网页的一部分,出于不值得解释的原因,该请求要求一个全新的 HTML 页面(包括其头部),然后仅提取其中包含的 HTML指定的元素(由 ID 标识)。

最初,我有以下 JavaScript 代码,每当对新 HTML 的 AJAX 请求完成时,它就会运行:

var $newContent = $(newHtmlContent);
loadingElement.innerHTML = $("#" + loadingElementId, $newContent).html();

这很棒,直到我加载了一些包含在指定元素中的 HTML,其中包括一些需要运行的脚本,所以我将其更改为:

var $newContent = $(newHtmlContent);
$(loadingElement).html($("#" + loadingElementId, $newContent).html());

我读到 jQuery 将使用 html() 函数的 HTML 字符串参数评估任何脚本 - 然而,问题似乎是脚本在此调用之前被剥离。 通过 Firebug 查看后,似乎正在发生以下情况:

$(newHtmlContent) // includes all 'script' elements
$("#" + loadingElementId, $newContent) // has no scripts
$("script", $newContent) // empty jQuery object

有人有什么建议吗? 提前致谢。

最佳答案

做了 quick test (fiddle) ,将以下标记作为字符串:

<div id="root">
    <div>some dynamic content</div>
    <script type="text/javascript">alert("hello");</script>
    <div class="desiredElement">after script</div>
</div>

jQuery 会产生一个类似

的对象
> [0]: #root
> [1]: script

[0] 将包含 #root 中除脚本之外的所有 html,脚本被分离到它们自己的对象中。这似乎适用于标记中的所有脚本。

所以你可以做这样的事情来运行脚本:

var $new = $(dynamicContent); // dynamicContent is string
var $desired = $new.find('.desiredElement');

$new.eq(1).appendTo('body'); // run the script

关于javascript - jQuery 在复杂的 HTML 字符串中评估 JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5705921/

相关文章:

javascript - 如何更改 IFRAME location.hash 值而不让父级跳转到 IFRAME?

javascript - 捕获 "open link in new tab"和 "Open link in new window"事件

javascript - 单击时在文本框中设置日期

Jquery:变量作为 ID 选择器不起作用

javascript - jQuery 电话号码屏蔽与正则表达式不起作用

javascript - 在列表中显示按钮 - AngularJS

javascript - KnockoutJS 更新行总和字段

javascript - 如何选择溢出省略号的开始位置

javascript - 兄弟 div 上的 removeClass 不起作用

jQuery 选择器通配符不存在的地方