Javascript 我如何循环使用li'；让我们阅读url的一部分，然后用Jquery将其作为类添加到li中

嗨，我需要一些帮助

这是我的密码：-

  <ul class="product nobullet clearfix nomargin">
      <li class="product1">
          <div class="img-holder">
          <a href="/Mens/Shower/Bodywash/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
      <li class="product2">
          <div class="img-holder">
          <a href="/Mens/Shower/shampoo/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
      <li class="product3">
          <div class="img-holder">
          <a href="/Mens/toiletries/deoderant/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
  <ul>

  <script>
  $('ul.product').children().has("li").each(function(){
      var url = $(this).find('div.img-holder a').attr('href');
      url = url.split("/");
      alert(url);
      $(this).children("li").addClass(url[3]);
  });
  </script>

$（'ul.product'）.children（）.has（“li”）.each（function（））{
var url=$（this）.find（'div.img-holder a'）.attr（'href'）；
url=url.split（“/”）；
警报（url）；
$（this.children（“li”）.addClass（url[3]）；
});

它不起作用，我还是jquery新手，需要一些帮助。 我需要阅读li的每个产品类，阅读url，使用/作为asperator获取3项，然后将其添加到li类。代码需要在所有的产品中循环

最多可以有20个产品类别，所有类别都以产品开头，然后在末尾有一个数字，例如product1

不确定我是否解释得足够好，所以。。。。 jquery代码运行后，html应如下所示：-

  <ul class="product nobullet clearfix nomargin">
      <li class="product1 bodywash/">
          <div class="img-holder">
          <a href="/Mens/Shower/bodywash/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
      <li class="product2 shampoo">
          <div class="img-holder">
          <a href="/Mens/Shower/shampoo/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
      <li class="product3 deoderant">
          <div class="img-holder">
          <a href="/Mens/toiletries/deoderant/p/704357">
          <img src="/medias/sys_master/front/src/8838871056414.jpg"/>
          </a>
          </div>
      </li>
  <ul>

在迭代li时，只需使用

$（this）.addClass（url[3]）

尼廷的回答几乎是正确的

首先，由于您是jQuery新手，因此有必要解释一下，您的选择器与您认为的不匹配

$('ul.product').children().has("li")

将匹配具有后代的ul的任何子级，该后代为
。由于列表项是列表的子项，因此它们本身不会将列表项作为子项

 $('ul.product li').each(function(){
      var url = $(this).find('div.img-holder a').attr('href');
      url = url.split("/");
      alert(url);
      $(this).addClass(url[3]);
  });

关于这段代码，值得注意的是JavaScript是一种基于零的语言。因此，您需要使用
url[2]
获取该数组中的第三项
听说过标点符号吗？
 $('ul.product li').each(function(){
      var url = $(this).find('div.img-holder a').attr('href');
      url = url.split("/");
      alert(url);
      $(this).addClass(url[3]);
  });