Question

我已经构建了一个小网站来测试使用.load()方法来加载元素的内容。虽然.load在我将目标元素放在<div>标记内时起作用，但是我不能让它只对目标元素，<h1>标记中的页面标题起作用。有没有办法使用.load()加载内容而不在我的HTML中的每个受影响的元素周围放置<div>标记？

我的第1页HTML：

<body>
<h1 id="pagetitle">Page 1</h1>
<p>Some paragraph text</p>
<a id="page2">page 2</a>
</body>

对于第2页，HTML是相同的，但标题为<h1>Page 2<h1>。

我的jQuery：

$('a#page2').click(function () {
$("#pagetitle").load("page2.html #pagetitle > *");
});

从我读过的所有内容中，点击＃page2应该从page2.html加载＃pagetitle标记的内容，但不添加内容 - 相反，内容（“第1页”）只是消失了。

但是，如果我在<div>元素周围添加<h1>标记并改为加载div：

$("div#pagetitle").load("page2.html div#pagetitle > *");

内容已被替换。但是，为了保持我的HTML整洁，如果有更好的方法，我想避免这种情况。

Answer 1

> *选择#pagetitle元素的直接子元素，在您的标记h1元素中没有任何后代元素，因此查询失败并且它不返回任何内容，删除{{ 1}}选择器，它应该工作。但是，它会将加载的> *元素添加到当前h1元素，jQuery h1方法使用.load()实用函数，您可以使用此函数替换元素或更改当前$.get()元素的innerHTML属性。这使您可以更好地控制加载的html。

h1

.load（）非DIV元素的方法

1 个答案: