jQuery创建包含子元素的元素

Question

Creating a div element in jQuery在描述如何创建和插入元素方面做得很好，但是，我希望创建一个带有子元素的元素，例如<li><a href="abc.html">click</a></li>。 href和文本容易受到XSS的影响，所以我需要采取措施。我可以创建<a>元素，如：

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

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

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

Answer 2

就个人而言，我喜欢直接在html中执行此操作：

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

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

Answer 3

首先，您可以将<li>标记附加到ID为mySelector的元素。

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

然后将<a>标记附加到li元素。