jQuery的.after((插入一个同级元素,而不是子元素。例如,如果你有
我正在使用jQuery在所有a旁边添加一个按钮>在页面上找到SPAN标记。页面本身随着用户向下滚动而增长,这就是我使用滚动功能的原因——我需要不断地将按钮添加到新的页面部分。
下面的代码不断地向已经有按钮的部分添加按钮。我试图在每个找到的标签组合旁边只显示一个按钮。我试过我能想到的每一种组合。我希望有人能给我一个简单的解决方案。
谢谢。
$(window).scroll(function () {
if (!$("a span button").length) {
$("a span").after(
' <button type="button" class="btn btn-secondary btn-sm">BUTTON</button>'
);
}
});
<a>
<span>Text</span>
</a>
你的代码的结果将是
<a>
<span>Text</span>
<button>BUTTON</button>
</a>
这与选择器"a span button"
不匹配,因为<button>
不是<span>
的后代。
相反,我会在<span>
中添加一些属性或类,以确定它已被按钮化,然后您可以在选择中省略这些元素
$(window).scroll(() => {
$("a span:not(.buttonised)").each((_, span) => {
$(span)
.addClass("buttonised")
.after(
$("<button>", {
class: "btn btn-secondary btn-sm",
text: "BUTTON",
type: "button",
})
);
});
});