如何从Array&获取图像图标在DIV中一一追加 [英] How to fetch image icons from an Array & append one by one inside DIVs

问题描述

如何从Array&在DIV中一一追加.我有一个带有图像路径的数组.我想从该数组中获取图像&在DIV中一一追加.

How to fetch image icons from an Array & append one by one inside DIVs. I have an array with image path. I want to fetch images from that array & append one by one inside DIVs.

我想在"class = acc_trigger" div中添加这些图标.这是HTML

I want to append those icons in "class=acc_trigger" divs.. here is the HTML

<div class="container">

    <h2 class="acc_trigger"><a href="#">Home</a></h2>
    <div class="acc_container">
        <div class="block">
            <ul>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
            </ul>

        </div>
    </div>

    <h2 class="acc_trigger"><a href="#">Req Mgmt</a></h2>
    <div class="acc_container">
        <div class="block">
                <ul>
                <li><a href="#">Requirments</a></li>
                <li><a href="#">Use Cases</a></li>
                <li><a href="#">Test Cases</a></li>
            </ul>         
        </div>
    </div>

    <h2 class="acc_trigger"><a href="#">Test</a></h2>
    <div class="acc_container">
      <div class="block">
            <ul>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
            </ul>
        </div>
    </div>

    <h2 class="acc_trigger"><a href="#">Project</a></h2>
    <div class="acc_container">
        <div class="block">
            <ul>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
                <li><a href="#">One</a></li>
            </ul>
        </div>
    </div>

</div>

*********** JQUERY ARRAY *****************


 var $iconLeft = new Array();
                $iconLeft[0] = 'images/icons/home_icon.gif';
                $iconLeft[1] = 'images/icons/reqMgmt_icon.gif';
                $iconLeft[2] = 'images/icons/test_icon.gif';
                $iconLeft[3] = 'images/icons/project_icon.gif';
                $iconLeft[4] = 'images/icons/issue_icon.gif';
                $iconLeft[5] = 'images/icons/more_icon.gif';

我应该使用.each()吗?如果是这样，该如何使用?请帮忙.

Should I use .each() ?? if so, how to use that? please help.

推荐答案

尝试一下:

$(document).ready(function () {  
$('h2.acc_trigger').each(function(i){
  var icon = new Array;
  icon[0] = 'images/icons/home_icon.gif';
  icon[1] = 'images/icons/reqMgmt_icon.gif';
  icon[2] = 'images/icons/test_icon.gif';
  icon[3] = 'images/icons/project_icon.gif';
  icon[4] = 'images/icons/issue_icon.gif';
  icon[5] = 'images/icons/more_icon.gif';

  $(this).prepend('<img src='+icon[i]+' />');
  });                
});

这篇关于如何从Array&获取图像图标在DIV中一一追加的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！