我可以使用伪元素插入html元素吗？

Question

我想在所有li之后插入一个html元素。 例如： HTML：

<ul>
 <li>some text</li>
 <li>some text</li>
 <li>some text</li>
</ul>

的CSS：

li:after{
  content:"<div class="someclass"></div>";
}

但它不起作用

Answer 1

不幸的是，你can't do that with CSS。但它可以在JavaScript中使用，例如使用jQuery .append(); method。

// Add Baz to .myList
$( ".myList" ).append($("<li>Baz</li>"));

<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul class="myList">
  <li>Foo</li>
  <li>Bar</li>
</ul>

Answer 2

如果你需要在每个li元素后面显示一些图形元素，那么选项是在content属性中使用url：

content: url(/pictures/logo.gif);