jQuery创建包含子元素的元素

Question

在jQuery中创建div元素描述了如何创建和插入元素，但是我希望创建一个带有子元素的元素，例如<li><a href="abc.html">click</a></li>。链接和文本容易受到XSS攻击，因此我需要采取措施。我可以像这样创建<a>元素：

var href='abc.html',text='click';
jQuery('<a/>', {
    href: href,
    text: text
}).appendTo('#mySelector');

如何修改以包含</li>元素？

- user1032531

Answer 1

总结一下：

$(document).ready(function() {
  var href='abc.html',text='click';

jQuery('<a/>', {
    href: href,
    text: text
}).wrap("<li>").parent().appendTo('#mySelector');


})

http://codepen.io/anon/pen/Eyqco

- LorDex

Answer 2

个人而言，我喜欢直接在HTML中完成它：

var html = "";
html += "<li>";
html += "<a href='www.google.com' >click me</a>";
html += "</li>";

$("myselector").append(html);

- Mathieu Labrie Parent

---

正如我所指出的，点击我这个文本是由用户提供的。这可能会导致 XSS 攻击。 - user1032531

Answer 3

首先，您可以将<li>标签附加到具有id mySelector的元素上。

$('<li>').appendTo('#mySelector');

然后，你将你的<a>标签添加到li元素中。

- LiamWilson94

---

谢谢LiamWilson。我认为可能有更直接的方法来做到这一点。 - user1032531

@user1032531，已经有了。请看我的答案 ;) - LorDex

或者，您可以将li元素包装在<a>标记周围。 - LiamWilson94