调用jQuery.fn.load时是可以在url后面加选择器来指定加载的内容的。文档里这样描述：
|
默认使用 GET 方式 - 传递附加参数时自动转换为 POST 方式。jQuery 1.2 中，可以指定选择符，来筛选载入的 HTML 文档，DOM 中将仅插入筛选出的 HTML 代码。语法形如 "url #some > selector"。请查看示例。 $("#links").load("/Main_Page #p-Getting-Started li"); |
不过有一个问题，如果指定了选择器，页面里的脚本就不会执行，查看了jQuery的代码之后发现，原来是有选择器的时候，将所有脚本过滤掉了
|
jQuery 1.8.3源码两个片段： rscript = /<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, // 逗号是因为这是一个语句的一部分 // See if a selector was specified self.html( selector ? // Create a dummy div to hold the results jQuery("<div>") // inject the contents of the document in, removing the scripts // to avoid any 'Permission Denied' errors in IE .append( responseText.replace( rscript, "" ) ) // Locate the specified elements .find( selector ) : // If not, just inject the full result responseText ); |
那么，如果想执行页面中的脚本，只需要找到页面内容中的脚本再执行一次就行了。在load的callback中，是可以取到整个页面内容的，所以只需要一句话就可以解决：
计算
安全
数据库
网络和加速
企业服务
$("#place_holder").load("Page.html #content", function(html) { // 加载html内容到页面上，里面的css和script都会执行 // 加载之后即把当前的临时DIV删掉（没验证，如果有问题可以不remove） $("<div>").html(html).remove(); }); 不过既然jQuery要把脚本过滤掉就有它的道理……因为html里的css和script有可能会有一部分是不想调用的，怎么处理呢？用与jQuery过滤script的类似的办法，把所有script找出来，再选出需要执行的来执行。
于是，约定，在script中加入一个属性loadinvoke="true"的会在加载内容后执行，如定义这样的<script>：
<script type="text/javascript"> console.log("这是不需要jQuery.fn.load时执行的脚本") </script> <script type="text/javascript" loadinvoke="loadinvoke"> console.log("这是需要jQuery.fn.load时执行的脚本") </script> 给加载的脚本加点料：
rscript = /<script\b[^>]*\b loadinvoke \b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi; $("#place_holder").load("Page.html #content", function(html) { // 找出符合条件的脚本 var m = html.match(rscript); for (var i = 0; i < m.length; i++) { // 生成临时的div执行脚本 $("<div>").html(m[i]).remove(); } }); 抛砖引玉
亿速云「云服务器」，即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘，价格低至29元/月。点击查看>>
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
