我想将外部 html 文件的整个 html 内容从服务器加载到我的网站中 - 就像 php inculde 或多或少会做的那样。
到目前为止，我可以在使用 id 和 all 的同时加载整个文件并在 div 中显示。
但是我怎样才能只显示div的一部分呢？
这是我的 HTML 和 jQuery 脚本:
<html>
<head>
<meta title="TITLE">
<link rel="stylesheet" href="css/style.css" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#main").load('file.html');
});
</script>
<style></style>
</head>
<body>
<div id="main">
<div id="PlaceSubNaviOne"></div>
<div id="PlaceSubNaviTwo"></div>
</div>
</body>
</head>
这是我要加载的 HTML 文件的内容:
<div id="subnavione">
<ul>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
<li>CITY1</li>
</ul>
</div>
<div id="subnavitwo">
<ul>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
<li>CITY2</li>
</ul>
</div>
我现在想做的是，只加载一次文件，然后将内容放入我在网站上放置的特定 div 中。例如，我想放置 div subnavione来自file.html进入div PlaceSubNaviOne subnavitwo 也是如此和PlaceSubnaviTwo .
这可以用 jQuery load() 实现吗？或者我必须使用不同的方式来完成此任务？
最佳答案
尝试一下:您可以在此处使用.get()，如下所示
$(document).ready(function(){
$.get( "file.html", function( data ) {
$( "#PlaceSubNaviOne" ).html( $($.parseHTML(data)).filter("#subnavione") );
$( "#PlaceSubNaviTwo" ).html( $($.parseHTML(data)).filter('#subnavitwo') );
});
});
有关jquery的更多信息get()
关于javascript - jQuery load() 整个 html 文件但只显示单个 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32328740/