我想使用jQuery来构建
HTML,如下所示:
<li><a href="#"><span class="play"></span><span class="trackName">Track Name</span></a></li>
看起来很简单,但我无法弄清楚如何将HTML标签作为我的锚文本的一部分.
如果我使用像:
$("<a />",{ text: $('<SPAN class="play" />') + "Track Name" })
那么span标签就被转义了.
解决方法
有几种方法可以实现,包括(但不限于):
// one big string $('<a href="#"><span class="play"></span><span class="trackName">Track Name</span></a>') // create <a> then append() the span $('<a></a>').attr("href","#") .append('<span class="play"></span><span class="trackName">Track Name</span>'); // create <a> then set all of its contents with html() $('<a></a>').attr("href","#") .html('<span class="play"></span><span class="trackName">Track Name</span>'); // append spans created earlier: var spans = $('<span class="play"></span><span class="trackName">Track Name</span>'); var a = $('<a></a>').append(spans);
请注意.html()替换任何和所有现有的内容,而.append()添加到最后.因此,如果您在示例中有两个跨度元素,则可以单独创建这些元素,并一次添加一个元素:
$('<a href="#"></a>').append('<span class="play"></span>') .append('<span class="trackName">Track Name</span>');