php - 针对特定列表项并通过 jquery 输入文本？

Question

如何定位所有“3 级”和“4 级”链接并在为链接显示的文本前输入破折号？

例如，从下面的代码中，任何说“Level 3 Page 1”或“Level 4 Page 1”的东西现在都会说“- Level 3 Page 1”

这是由 Wordpress 生成的（所以我不能只在链接中输入破折号）：

<ul>
    <li class="top-level"><a href="#">Extra Curriculum</a></li>
    <li class="page_item page-item-42"><a href="#">Level 2 Page 1</a></li>
</ul>
<ul class='children'>
    <li class="page_item page-item-51">
        <a href="#">Level 3 Page 1</a>
        <ul class='children'>
            <li class="page_item page-item-56"><a href="#/">Level 4 Page 1</a></li>
            <li class="page_item page-item-57"><a href="#">Level 4 Page 2</a></li>
            <li class="page_item page-item-59"><a href="#">Level 4 Page 3</a></li>
        </ul>
    </li>
    <li class="page_item page-item-52"><a href="#">Level 3 Page 2</a></li>
    <li class="page_item page-item-54"><a href="#">Level 3 Page 3</a></li>
</ul>
<ul>
    <li class="page_item page-item-44"><a href="#">Level 2 Page 2</a></li>
    <li class="page_item page-item-47"><a href="#">Level 2 Page 3</a></li>
</ul>

我猜这是jquery的工作？

Answer 1

$("a:contains(Level 3),a:contains(Level 4)").each(function() {
    $(this).text("- "+$(this).text());
});

Answer 2

就像是

li.level3, li.level4
{
   background-position: left;
   background-image : "url(dash.jpeg)";
   background-repeat: no-repeat;
   padding-left:10px;
}

Answer 3

希望这有帮助

$('ul .children a').each(function() {
$(this).text("- "+$(this).text());
});

Answer 4

jQuery代码：

$('a:contains(Level 3), a:contains(Level 4)').prepend('-');

链接到：JSFIDDLE

Answer 5

您可以使用:before伪元素：

.children > li:before {
  content: "-";
}