有A，B两个页面如何用JS在A中的某块区域显示B页面！

B页面做成单独的JS文件。在A面引用进来即可。

如果你有用用 jQuery 的话,可以参考下面的代码:
A.html

<!DOCTYPE html>
<html>
 <head>
  <title> A </title>
 </head>

 <body>
<div id="hello"></div>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
    $('#hello').load('B.html');
</script>
</body>
</html>

B.html 页面

<!DOCTYPE>
<html>
 <head>
  <title> B </title>
 </head>

 <body>
 <h2>222222222222222</h2>
asldfkajlskjflajksdf
 </body>
</html>

效果:

如果只想取 B 页面中的一部分数据的话, 比如想要这个 h2, 那么代码是这样的:

$('#hello').load('B.html h2');

效果是这样的:

关于 load 方法的帮助文档, 可参考这里: http://api.jquery.com/load/

如果你没有使用 jQuery 话, 那么大概的流程是这样的:
使用 ajax 请求 B.html (B页面), 得到内容后将它填充到 A页面 的指定容器中.

伪代码类似于下面这样:

ajax.get('b.html', function(html){
    document.getElementById('some_dom_id').innerHTML = html;
});

如果还要运行 B页面 中的js的话, 还需要再做单独处理, 可参考 jQuery 源码中的相关代码.

【热门文章】