我的程序生成以下html代码。而且我需要通过客户端脚本(jquery)对其进行调整,以便准确查看下面我发现的极端代码。请注意,我无法在服务器端修改代码。我需要删除ul和li标签,同时保留href链接和标签名称,并添加一个CSS类。我还需要删除给定的字体大小:10px。我不是js方面的专家,因此我需要您的帮助来弄清楚该怎么做。我尝试了一些脚本,包括以下脚本,但它完全删除了所有li标签及其内容。

<script type="text/javascript">
var lis = document.querySelectorAll('.Zend_Tag_Cloud li');
    for(var i=0; li=lis[i]; i++) {
        li.parentNode.removeChild(li);
}
</script>


我的程序生成的原始代码:

<ul class="Zend_Tag_Cloud">
        <li>
            <a href="/content/article/tag/136/" style="font-size: 10px;">workout  definition</a>
        </li>
        <li>
            <a href="/content/article/tag/140/" style="font-size: 20px;">workout  plans for men</a>
        </li>
        <li>
            <a href="/content/article/tag/139/" style="font-size: 20px;">workout  program</a>
        </li>
        <li>
            <a href="/content/article/tag/141/" style="font-size: 20px;">workout  routines for beginners</a>
        </li>
        <li>
            <a href="/content/article/tag/138/" style="font-size: 20px;">workout  schedule</a>
        </li>
        <li>
            <a href="/content/article/tag/137/" style="font-size: 20px;">workouts at home</a>
        </li>
    </ul>


最终的html代码应如下所示:

<a class="in-the-news-bar__link" href="/content/article/tag/136/">workout  definition</a>
<a class="in-the-news-bar__link" href="/content/article/tag/140/">workout  plans for men</a>
<a class="in-the-news-bar__link" href="/content/article/tag/139/">workout  program</a>
<a class="in-the-news-bar__link" href="/content/article/tag/141/">workout  routines for beginners</a>
<a class="in-the-news-bar__link" href="/content/article/tag/138/">workout  schedule</a>
<a class="in-the-news-bar__link" href="/content/article/tag/137/">workouts at home</a>

最佳答案

那这个呢?

    var $zendTagCloudLinks = $(".Zend_Tag_Cloud").find("a")
        .addClass("in-the-news-bar__link")
        .removeAttr("style");

    $zendTagCloudLinks.insertAfter(".Zend_Tag_Cloud");
    $(".Zend_Tag_Cloud").remove();

关于javascript - 通过JavaScript调整html标签和CSS样式,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42704834/

10-09 16:46
查看更多