开发者

How to click multiple instances of the same icon on a webpage? (Javascript)

I want to write a script that will click every instance of a certain icon. The following code is from the source that is what I want to click on. It has a onclick event defined, I just don't know how to search the page for these icons and then click on them. Can anyone help? Thanks.

<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 f开发者_如何学编程alse;"></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>


If not using 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() remorselessly poached from here.


Edit re: OP comment "The first <dd><a href="javascript:void(0);" I want to click"

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;
    }
}


if using jQuery:

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

if using native DOM manipulation (no jQuery) something like this:

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

Edit: added native javascript code as well.

(isn't it obvious however with this that jQuery is a great addition?)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜