在列表项的文本之前放置带图像的跨度

Question

我的HTML结构如下所示：

<li class="thing"><a href="#" class="my-link">Something</a></li>

我的目标是在链接标记前添加一个看起来像这样的范围：

<span class="my-span"></span>

这样做的最佳方法是什么？它是CSS :before还是jQuery / Zepto .before方法？此外，关于如何执行此操作的正确语法将是有帮助的。我一直在努力解决这个问题。

谢谢！

Answer 1

$('<span class="my-span"></span>').insertBefore('.my-link');

从.insertBefore

查看更多详情

Answer 2

如果您需要<span>生成dynamically，您可以选择Jquery .before()

您可以在以下链接中找到有关exaples的信息

http://api.jquery.com/before/

Answer 3

以下是使用Javascript的方法。 （试用FireBug for Firefox）

a = document.getElementsByClassName("my-link")
//Now a[0] will have your first link
b = document.createElement("span") //Your new span element
b.setAttribute("class","my-span")
a[0].parentElement.insertBefore(b,a[0])

这有帮助吗？或者你想在jQuery中做到这一点吗？

信息来源here。