jquery load（）遇到麻烦

Question

在我的网络应用程序的某些部分，我有ajax login机制，成功登录后，我使用以下代码更新topbar，而不是刷新页面。

$("#top-bar").load($(location).attr('href'));

上面的代码行更新topbar没有任何问题，但在某些页面我openlayers maps，页面结构由于上面的行而完全破坏。因为我在同一页面上使用jQuery tabs。

搜索后我发现脚本中的某些特殊字符可能会导致这类问题。因此很难找到导致此问题的代码行，最后我使用下面的行来更新topbar。

$("#top-bar").load($(location).attr('href')+' #top-bar');

这行代码没有任何问题，作为开发人员，我想知道 上述两个调用之间的区别是什么？

修改

我第一次打电话时甚至出现问题，我没有观察到页面被破坏的部分。读完答案后，我清楚地看到了这个页面。无论如何，第二次通话对我来说是完美的。很抱歉通过询问此类问题来解决问题，感谢所有为此问题做出贡献的人。

Answer 1

来自official documentation：

使用不带后缀选择器表达式的URL调用.load（）时，在删除脚本之前将内容传递给.html（）。这将在丢弃之前执行脚本块。但是，如果使用附加到URL的选择器表达式调用.load（），则在更新DOM之前会删除脚本，因此不会执行脚本。两种情况的例子如下所示：

此处，作为文档一部分加载到#a中的任何JavaScript都将成功执行。

$( "#a" ).load( "article.html" );

但是，在下列情况下，加载到#b的文档中的脚本块将被删除而不会执行：

$( "#b" ).load( "article.html #target" );

我认为这正是你要找的。

Answer 2

第一个示例是在href中加载外部页面的整个HTML内容并插入所有内容：

$("#top-bar").load($(location).attr('href'));

第二个示例是加载href的整个HTML内容，但只插入该页面的#top-bar而不是整个文档：

$("#top-bar").load($(location).attr('href')+' #top-bar');

<强> .load() API docs

Answer 3

为了更好地理解我更改了ID：

$("#top-bar").load($(location).attr('href'));

这个加载链接的全部内容并将其附加到＃top-bar

$("#top-bar").load($(location).attr('href')+' body');

这个只加载链接的主体并将其附加到#top栏。

我认为它在两种情况下均有效，因为您在加载的文档中有#top-bar。