如何在网页上单击同一图标的多个实例? (JavaScript)的

时间:2011-01-14 17:52:39

标签: javascript

我想编写一个脚本,点击某个图标的每个实例。以下代码来自我要点击的源代码。它定义了一个onclick事件,我只是不知道如何在页面中搜索这些图标,然后单击它们。有人可以帮忙吗?感谢。

<dl class="recommend">
    <dt class='recs'>
        <a href="javascript://" onclick="RecSpy('article', '6107445', 'tippers'); return false;">1</a>&nbsp;
    </dt>
    <dd>
        <a href="javascript:void(0);" onclick="RecommendItem(1,'article','6107445','1','recommendstatus_article6107445'); return false;" onmouseover="return overlib('Give thumbs up', WRAP);" onmouseout="return nd();">&nbsp;
            <img class='icon' title='' alt='Thumb up' style='background-position: -304px -48px;' src='http://geekdo-images.com/images/pixel.gif' />
        </a>
    </dd>
    <dt class='tippers'>
        <a href="javascript://" style='color: #969600;' onclick="RecSpy('article', '6107445', 'tippers'); return false;"></a>
    </dt>
    <dd>
        <a href="javascript:void(0);" onmouseover="return overlib('GeekGold Tip', WRAP );" onmouseout="nd();" onClick="GeekGoldTip(0,'article','6107445','recommendstatus_article6107445'); return false;">&nbsp;
            <img class='icon' title='' alt='tip' style='background-position: -368px -48px;'   src='http://geekdo-images.com/images/pixel.gif' />
        </a>
     </dd>
     <dd>
         <a href="javascript:void(0);" onclick="RecommendItem(0,'article','6107445','','recommendstatus_article6107445', 'article6107445' ); return false;" onmouseover="return overlib('Hide this post', WRAP);" onmouseout="return nd();">&nbsp;
             <img class='icon' title='' alt='Thumb up' style='background-position: -336px -48px;' src='http://geekdo-images.com/images/pixel.gif'/>
         </a>
     </dd>
     <dt class='thumbsdown'></dt>
 </dl>

2 个答案:

答案 0 :(得分:1)

如果使用jQuery:

$('img.icon').parent().click();

如果使用本机DOM操作(没有jQuery),就像这样:

var icons = document.getElementsByTagName('img');
for(var i = 0; i < icons.length; i++){
   if(icons[i].className == 'icon'){
       icons[i].parentNode.onclick();
   }
}

编辑:添加原生javascript代码。

(不过很明显,jQuery是一个很好的补充吗?)

答案 1 :(得分:1)

如果不使用jQuery:

function fireClick(elem)
{
    if (!elem) return;

    if (document.dispatchEvent)
    {
        // W3C
        var oEvent = document.createEvent("MouseEvents");
        oEvent.initMouseEvent("click", true, true, window, 1, 1, 1, 1, 1, false, false, false, false, 0, elem);
        elem.dispatchEvent(oEvent);
    }
    else if (document.fireEvent)
    {
        // IE
        elem.click();
    }
}

var images = document.getElementsByTagName('img'),
    i,
    len = images.length,
    image;
for (i=0; i<len; i++)
{
    image = images[i];
    if (image.className === 'icon')
    {
        fireClick(image.parentNode);
    }
}

fireClick()无情地从here偷猎。


修改:OP评论“我要点击的第一个<dd><a href="javascript:void(0);"

function fireClick(elem)
{
    if (!elem) return;

    if (document.dispatchEvent)
    {
        // W3C
        var oEvent = document.createEvent("MouseEvents");
        oEvent.initMouseEvent("click", true, true, window, 1, 1, 1, 1, 1, false, false, false, false, 0, elem);
        elem.dispatchEvent(oEvent);
    }
    else if (document.fireEvent)
    {
        // IE
        elem.click();
    }
}

var images = document.getElementsByTagName('img'),
    i,
    len = images.length,
    image;
for (i=0; i<len; i++)
{
    image = images[i];
    if (image.className === 'icon' && image.parentNode.nodeName === 'A' && image.parentNode.parentNode.nodeName === 'DD')
    {
        fireClick(image.parentNode);
        break;
    }
}