当前位置 : 主页 > 网页制作 > JQuery >

jQuery:如果是XYZ,请将此类添加到此AND元素中

来源:互联网 收集:自由互联 发布时间:2021-06-15
我有一个无序列表,其中包含未知数量的列表项,未知顺序. 我需要找到一个包含.colspan类的列表项,看看它后面的项是否也有该类,然后根据跟随它的数量添加一个类. 如果只有1本身,那就给
我有一个无序列表,其中包含未知数量的列表项,未知顺序.

我需要找到一个包含.colspan类的列表项,看看它后面的项是否也有该类,然后根据跟随它的数量添加一个类.

如果只有1本身,那就给那个李另一个等级1-col.

如果连续两个,2-col.

如果连续三个,3-col.

我一次不需要超过3个.

例如….

之前:

<ul>
  <li class="colspan">content</li>
  <li class="other">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="other">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="other">content</li>
</ul>

后:

<ul>
  <li class="colspan 1-col">content</li>
  <li class="other">content</li>
  <li class="colspan 2-col">content</li>
  <li class="colspan 2-col">content</li>
  <li class="other">content</li>
  <li class="colspan 3-col">content</li>
  <li class="colspan 3-col">content</li>
  <li class="colspan 3-col">content</li>
  <li class="other">content</li>
</ul>

我假设我以某种方式使用.next()?然后,当然,.addClass().那部分我很擅长.这是试图弄清楚如何应用1-col,2-col,3-col,这是一个挑战.

任何帮助将不胜感激!

一种可能性是具有递归函数,该函数使用colspan类计算下一个元素的数量.迭代所有colspans,检查.prev元素是否是colspan.如果是,则将类名设置为前一个元素的-col类,否则使用当前colspan调用递归函数(这将是任何colspans系列中的第一个):

const getCount = (elm) => {
  const next = elm.next();
  return next.hasClass('colspan')
  ? 1 + getCount(next)
  : 0
};
  
$('.colspan').each(function() {
  const $this = $(this);
  const $prev = $this.prev();
  $this.addClass(
    $prev.hasClass('colspan')
    ? $prev.attr('class').split(' ')[1]
    : 'col-' + (1 + getCount($this))
  )
});
console.log($('ul').html());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="colspan">content</li>
  <li class="other">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="other">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="colspan">content</li>
  <li class="other">content</li>
</ul>
网友评论