javascript - 使用 jQuery 和链接操作 DOM 元素

Question

稍微玩了一下 jQuery(抱歉，完全菜鸟)我想知道为什么这不起作用。也许我不了解链接、上下文和 DOM 操作的工作方式，但我只是好奇。开始了:

$("#myDiv")
    .append("h3")
    .append("a")
    .attr("href", "http://example.com")
    .text("Click here")
    .end();

我希望发生的事情:

• 选择#myDiv
• 在里面插入一个H3
• 然后在H3里面，插入一个A标签
• 将 A 标签的 HREF 属性设置为 URL
• 然后将A标签的文本设置为“点击这里”

相反，我的页面标记似乎完全搞砸了，尽管我看不到动态 DOM，所以我不确定发生了什么。我读错了 jQuery 文档吗？

Answer 1

应该是

$("#myDiv")
    .append("<h3>").children('h3:last')
    .append("<a>").children('a:last')
    .attr("href", "http://example.com")
    .text("Click here")

每个方法都返回执行它的原始 jQuery 对象(traversing 除外，如 find、children 等)这样您就可以继续处理它们。

我完全删除了 .end()，因为它只有在您使用改变 jQuery 对象的遍历方法时才有用。

---

所以你原来的，(除了 html in append needs tags if you want to add tags 的错误)会将 h3 附加到 #myDiv ，然后再次将 a 附加到 #div，然后将属性 href 设置到 #myDiv 并最终设置其文本 - #myDivs 文本 ;)。

一切都将在 #myDiv 上完成。