javascript – jQuery.after()无法按预期工作

前端之家收集整理的这篇文章主要介绍了javascript – jQuery.after()无法按预期工作前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
请看看: http://jsfiddle.net/s6VdW/

HTML:

<div id="test"></div>

JS:

var span1 = $("<span/>").text("Hello");
var br = $("<br/>");
var span2 = $("<span/>").text("World!");
span1.after(br).after(span2);

$("#test").append(span1);

预期结果是:

Hello
World

HTML的预期结果是:

<div>
    <span>Hello</span>
    <br/>
    <span>World</span>
</div>

错误是什么?根据jQuery Docs(http://api.jquery.com/after/),它应该是可能的:

.after() will also work on disconnected DOM nodes.

That set can be further manipulated,even before it is inserted in the document.

UPDATE

看来,在使用.after()之前,我需要先将第一个跨度附加到DOM.但是替代方案是什么?如果我无法访问DOM,例如因为我在代码中不知道DOM的一部分? http://jsfiddle.net/s6VdW/10/

更新2

我可以创建一个“临时”div,我将元素附加到其中.然后我归还那个div的孩子们.演示:http://jsfiddle.net/s6VdW/13/ – 这看起来像是要走的路吗?

解决方法

问题是您在创建span元素之前使用.after()的同时动态创建span1. span1.after(BR).经过(跨距2);在这一行中,它将搜索span1元素以应用.after()但该元素不存在.如果你清楚地了解为什么我们必须使用.ready()它在这里有相似之处.你的代码应该是这样的
var span1 = $("<span/>").text("Hello");
var br = $("<br/>");
var span2 = $("<span/>").text("World!");

$("#test").append(span1);
span1.after(span2).after(br);

并记住.after()从左到右添加元素,因此您必须使用.after(),顺序为9到1,因此它将给出结果1到9.

希望你能得到答案.

猜你在找的jQuery相关文章