我需要仅显示锚定的div，并能够与该锚定共享链接。它没有按预期工作（尝试bar1 (blank) bar2 (blank)链接）。如果从文件中加载了bar1（或bar2），则使用锚点www.foo.bar/main.html#bar1或bar1（bar2）加载main.html页面（如下所示）将无法正确处理CSS和jQuery。另一方面，如果#foo元素作为html字符串附加，则锚定链接似乎有效（例如www.foo.bar/main.html#foo）。要比较行为，请单击foo (blank)，bar1 (blank)，bar1，bar2 (blank)和bar2链接，bar1 (blank)和bar2 (blank)链接无法显示bar1（或bar2）div。显然，它与异步文件加载有关。有没有办法解决这个问题？
main.html：
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script>
$("<div>").load("bar1.html #bar1", function() {
$('body').append($(this).html());
});
$("<div>").load("bar2.html #bar2", function() {
$('body').append($(this).html());
});
$(function() {
$( 'body' ).append("<div id='foo' style='background-color:#8F8;'>FOO</div>");
});
</script>
<style>
div:not(:target) { display: none; }
div:target { display: block; }
</style>
</head>
<body>
<a href="main.html#foo" target="_blank">foo (blank)</a>
<a href="main.html#bar1" target="_blank">bar1 (blank)</a>
<a href="main.html#bar1">bar1</a>
<a href="main.html#bar2" target="_blank">bar2 (blank)</a>
<a href="main.html#bar2">bar2</a>
</body>
</html>
bar1.html：
<div id='bar1'>BAR1</div>
bar2.html：
<div id='bar2'>BAR2</div>
最佳答案
不知道您要怎么做。
但是尝试将jQuery包装在文档中
<script>
$(document).ready(function(){
$("<div>").load("bar.html #bar", function() {
$('body').append($(this).html());
});
$( 'body' ).append("<div id='foo' style='background-color:#8F8;'>FOO</div>");
});
</script>