为了账号安全,请及时绑定邮箱和手机立即绑定

如何使用 id 数组动态更改 href 属性?

如何使用 id 数组动态更改 href 属性?

HUWWW 2023-01-06 15:23:23

我有这些元素,我想通过我有类别的服务器使用获取的 id 数组动态更改 id(例如:)["category 1", "category 2","category 3","category 4","category 5", "category 6"]。我不知道该怎么做似乎没有任何效果。


<li role="presentation" class="active categories"><a href="#all" aria-controls="all" role="tab" data-toggle="tab">ALL</a></li>

                <li role="presentation" class="categories"><a href="#chicken" aria-controls="chicken" role="tab" data-toggle="tab">CHICKEN</a></li>

                <li role="presentation" class="categories"><a href="#fish" aria-controls="fish" role="tab" data-toggle="tab">FISH</a></li>

                <li role="presentation" class="categories"><a href="#turkey" aria-controls="turkey" role="tab" data-toggle="tab">TURKEY</a></li>

                <li role="presentation" class="categories"><a href="#miscellenous" aria-controls="miscellenous" role="tab" data-toggle="tab">MISCELLANOUS</a></li>

                <li role="presentation" class="categories"><a href="#frozen" aria-


查看完整描述

3 回答

?
慕田峪9158850

TA贡献1549条经验 获得超7个赞

`所以,根据你的问题,我了解到你想为每个元素提供 id 和获取的数组中的值。


所以对于第一个<li>元素,id 将是category 1。如果这是您要的,解决方案是获取所需的元素


<div id="parent">

    <ul>

      <li role="presentation" class="active categories"><a href="#all" aria-controls="all" role="tab" data-toggle="tab">ALL</a></li>

      <li role="presentation" class="categories"><a href="#chicken" aria-controls="chicken" role="tab" data-toggle="tab">CHICKEN</a></li>

      <li role="presentation" class="categories"><a href="#fish" aria-controls="fish" role="tab" data-toggle="tab">FISH</a></li>

      <li role="presentation" class="categories"><a href="#turkey" aria-controls="turkey" role="tab" data-toggle="tab">TURKEY</a></li>

      <li role="presentation" class="categories"><a href="#miscellenous" aria-controls="miscellenous" role="tab" data-toggle="tab">MISCELLANOUS</a></li>

      <li role="presentation" class="categories"><a href="#frozen" aria-controls="last" role="tab" data-toggle="tab">LAST</a></li>

    </ul>

  </div>





let fetchedArray = ['cat1','cat2','cat3','cat4','cat5','cat6'];

    $('li').each((i,el) => {

      $(el).attr('id',fetchedArray[i]);

    })


查看完整回答
反对 回复 2023-01-06
?
蓝山帝景

TA贡献1606条经验 获得超7个赞

`所以,根据你的问题,我了解到你想为每个元素提供 id 和获取的数组中的值。


所以对于第一个<li>元素,id 将是category 1。如果这是您要的,解决方案是获取所需的元素


<div id="parent">

    <ul>

      <li role="presentation" class="active categories"><a href="#all" aria-controls="all" role="tab" data-toggle="tab">ALL</a></li>

      <li role="presentation" class="categories"><a href="#chicken" aria-controls="chicken" role="tab" data-toggle="tab">CHICKEN</a></li>

      <li role="presentation" class="categories"><a href="#fish" aria-controls="fish" role="tab" data-toggle="tab">FISH</a></li>

      <li role="presentation" class="categories"><a href="#turkey" aria-controls="turkey" role="tab" data-toggle="tab">TURKEY</a></li>

      <li role="presentation" class="categories"><a href="#miscellenous" aria-controls="miscellenous" role="tab" data-toggle="tab">MISCELLANOUS</a></li>

      <li role="presentation" class="categories"><a href="#frozen" aria-controls="last" role="tab" data-toggle="tab">LAST</a></li>

    </ul>

  </div>





let fetchedArray = ['cat1','cat2','cat3','cat4','cat5','cat6'];

    $('li').each((i,el) => {

      $(el).attr('id',fetchedArray[i]);

    })


查看完整回答
反对 回复 2023-01-06
?
慕妹3242003

TA贡献1546条经验 获得超6个赞

如果要更改 id,可以使用 for 循环遍历元素并更改它们。


const categories = ["category 1", "category 2", "category 3", "category 4", "category 5", "category 6"];

for (var i = 0; i < document.getElementsByTagName("li").length; i++) {

  let el = document.getElementsByTagName("li")[i];

  el.id = categories[i];

  console.log(el);

}

<li role="presentation" class="active categories"><a href="#all" aria-controls="all" role="tab" data-toggle="tab">ALL</a></li>

<li role="presentation" class="categories"><a href="#chicken" aria-controls="chicken" role="tab" data-toggle="tab">CHICKEN</a></li>

<li role="presentation" class="categories"><a href="#fish" aria-controls="fish" role="tab" data-toggle="tab">FISH</a></li>

<li role="presentation" class="categories"><a href="#turkey" aria-controls="turkey" role="tab" data-toggle="tab">TURKEY</a></li>

<li role="presentation" class="categories"><a href="#miscellenous" aria-controls="miscellenous" role="tab" data-toggle="tab">MISCELLANOUS</a></li>

<!--

<li role="presentation" class="categories">

  <a href="#frozen" aria-

-->

上面的代码遍历了lis并将 ids 附加到 中的元素categories。然后它将元素打印到控制台,这样您就可以看到它们的 id 是如何设置的。



查看完整回答
反对 回复 2023-01-06
  • 3 回答
  • 0 关注
  • 15 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信