jquery - 将for循环生成的图标附加到列表项锚点中

2022-01-22 00:00:00 append jquery javascript

我将非常感谢一些指导甚至解决方案！

I would be very grateful for some guidance or even a solution!

从类名数组中，我使用 for 循环生成图标集:

From an array of class names, I'm generating icon sets using a for loop:

// icon array
var iconsArray = ['fa-search','fa-toggle-up','fa-link']; 
var iconsArrayLength = iconsArray.length;

    // loop through array
    for (var i = 0; i < iconsArrayLength; i++) {

        // result
        console.log('<i class="fa' + ' ' + iconsArray[i] + '"></i>');

    }

我还有一个导航元素.该列表具有相同数量的具有 ID 的项目:

I also have a navigation element. The list has the same number of items with an ID:

<nav>

    <ul id="nav">

        <li><a href="">link 1</a></li>
        <li><a href="">link 2</a></li>
        <li><a href="">link 3</a></li>

    </ul>

</nav>

问.如何将返回的图标集附加/添加到正确的导航项?

Q. How do I append / prepend the returned icon sets to the correct nav item?

需要明确的是，第一个数组值用于第一个导航项，依此类推.

To be clear, the first array value is intended for the first navigation item and so on.

我敢肯定有一些东西可以回答这个问题，但强大的 G 似乎并不想为我服务！

I'm sure there's something out there to answer this question, but the mighty G just doesn't seem to want to serve it up to me!

提前致谢.

回应评论...

结果列表如下所示:

<nav>

    <ul id="nav">

        <li><a href=""><i class="fa fa-search"></i>link 1</a></li>
        <li><a href=""><i class="fa fa-toggle-up"></i>link 2</a></li>
        <li><a href=""><i class="fa fa-link"></i>link 3</a></li>

    </ul>

</nav>

推荐答案

你甚至不需要 for 循环

You don't even need the for loop

$('#nav li').each(function(i) {
    $(this).append('<i class="fa' + ' ' + iconsArray[i] + '"></i>')
})

相关文章