我正在制作一个应用程序,其中包含一些菜单的页眉和页脚将保留在所有页面中。 现在的一种方法是在每个页面中编写页眉和页脚的代码,这是一个糟糕的选择。 另一个选择是使用 iframe,我正在使用它。这是我的代码-
<div style="height:75%;width:98%;">
<iframe name="someFrame" id="someFrame" frameborder="0" scrolling="yes" width="98%" height="100%"></iframe>
</div>
在此 iframe 中,我调用其他页面的内容。我有一个带有页眉和页脚的主页,中间部分将使用 iframe 进行更改。 为了完美地实现 iframe 的重叠,我使用了下面的 jquery 函数。
<script>
$("a").click(function(e) {
e.preventDefault();
$("#someFrame").attr("src", $(this).attr("href"));
$("a").removeClass("active");
$(this).addClass("active");
})
</script>
现在我需要的是 - 还有其他方法吗?我可以为页眉和页脚制作两个不同的页面,并获取每个页面中的内容吗?使用java??或 ajax 或其他......任何帮助将是值得赞赏的......
最佳答案
index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("demo_test.html",function(responseTxt,statusTxt,xhr){
if(statusTxt=="success")
alert("External content loaded successfully!");
if(statusTxt=="error")
alert("Error: "+xhr.status+": "+xhr.statusText);
});
});
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>
</body>
</html>
demo_test.html
<h1>I am not part of this page</h1>
关于javascript - 如何从一个html页面获取另一个html页面的内容?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26798325/