javascript - 如何删除超链接并在 javascript 创建的无序列表中添加类?

标签 javascript jquery arrays class html-lists

我有 javascript 的以下部分:

init: function() {
            var html = [];
            $.each(levels, function(nr) {
                html.push('<li><a href="#">');
                html.push(nr+1);
                html.push('</a></li>');
            });
        }

它给出以下 HTML 结果:

<div>
  <ul>
     <li><a href="#">1</a></li>
     <li><a href="#">2</a></li>
     <li><a href="#">3</a></li>
     <li><a href="#">4</a></li>
     <li><a href="#">5</a></li>
     <li><a href="#">6</a></li>
     <li><a href="#">7</a></li>
     <li><a href="#">8</a></li>
  </ul>
</div>

现在我还有一个从 HTML5 本地存储中获得的数字。假设这个数字是 5 . ( var number = 5 )

现在说说我需要的。我想要所有 href被删除,取而代之的是 class为每个 <li> 添加行中的数字大于 5 .所以if nr > 5 then remove href + add class X .

在这种情况下,HTML 结果将如下所示:

<div>
  <ul>
     <li><a href="#">1</a></li>
     <li><a href="#">2</a></li>
     <li><a href="#">3</a></li>
     <li><a href="#">4</a></li>
     <li><a href="#">5</a></li>
     <li class="x">6</li>
     <li class="x">7</li>
     <li class="x">8</li>
  </ul>
</div>

但是如何做到这一点呢?

最佳答案

你能像这样修改你的 init 函数吗?

init: function() {
    var html = [];
    $.each(levels, function(nr) {
        if (nr > number) html.push('<li class="x">', nr + 1, '</li>');
        else html.push('<li><a href="#">', nr + 1, '</a></li>');
    });
}

关于javascript - 如何删除超链接并在 javascript 创建的无序列表中添加类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21237869/

相关文章:

java - 使用 SQL 表中的 String[] 对象填充数组列表

javascript - 单击路由器时调用 API

javascript - 检测是否输入了字符或数字

javascript - 使用动画显示/隐藏元素

javascript - jQuery 重定向到 div 类名称页面 (IframeTracker.js)

带有事件模拟的 javascript UI 测试框架

javascript - MongoDB:forEach 与 fetch + each

javascript - 将省略号添加到最后可用的代码行

php - 使用php对特定值的数组进行排序

java - 代码在应该打印最大值和最小值时打印出数组的最大下标