点击onclick属性随机变化的每个onclick

时间:2018-03-18 01:00:33

标签: javascript onclick casperjs

我需要废弃网页并点击网络上的多个标签。 我正在检查onclick的属性值是否随机变化,我找不到选择每个标签的方法。 onclick属性是:     的onclick = “clickDashboard( '889113733777776')”     的onclick = “clickDashboard( '894967889413237')”

这是我想在每个标签上点击的html片段。我用getHTML()casprjs函数得到它,如果我尝试从源代码(crtl + U)复制我只能看到javascript代码。您还可以看到li标记类是如何“activetab”来指示显示哪个选项卡。 Here链接到完整的html源文件

<!--TEMPLATES-->
    <ul id="tabul">
        <li id="litab" class="ntabs add"><a href="" id="addtab" class="osx">+</a></li>
        <li id="litab" class="add rightAlign setting-item">
            <img src="/Content/images/icons/expand-24x24.png" class="out-triggerer gray" onclick="fullScreen()">            
        </li>        
        <li id="default-report-export" class="rightAlign">
            <a href="/report/defaultExport" download="">
                <input type="image" src="/Content/images/icons/excel.gif" value="Excel" title="Export default report">
            </a>
        </li>
        <li id="default-report-export" class="rightAlign">
            <a href="/report/defaultExport?isPdf=true" download="">
                <input type="image" src="/Content/images/export-pdf-24x24.png" value="Excel" title="Export default report">
            </a>
        </li>
        <li id="dbTab_889113733777776" class="ntabs addedTab activeTab">
            <span id="dbTabLabel_889113733777776" class="dashTitle" onclick="clickDashboard('889113733777776')">Dashboard EUR</span>
            <span id="dbTabSettings_889113733777776" class="settingsContainer dashSettings" style="">
                <div id="topnav" class="topnav">
                    <a href="javascript:void(0)" class="signin" onclick="toggleTabSettingsMenu('889113733777776',true);">
                        <span><img src="/Content/Images/icon_gear.png" alt="Edit"></span>
                    </a>
                </div>
                <fieldset id="dbTabSettingsMenu_889113733777776" class="dashSettings-menu">
                    <ul class="dashboardEditMenu">
                        <img src="/Content/images/close.png" onclick="toggleTabSettingsMenu('889113733777776',false);" alt="tooltip" style="position:absolute;right:2px;top:2px;border:0;">
                        <li class="dashboardEditMenuList">
                            <a href="javascript:void(0)" class="addWidget" onclick="toggleLeftUpdatePanelMenu(true);"> Añadir widgets</a>
                        </li>
                        <li class="dashboardEditMenuList">
                             <a href="javascript:void(0)" class="closeDash" onclick="deleteDashboard('889113733777776')"> Borrar este dashboard</a>
                        </li>
                    </ul>
                </fieldset>
            </span>
        </li>
        <li id="dbTab_894967889413237" class="ntabs addedTab">
            <span id="dbTabLabel_894967889413237" class="dashTitle" onclick="clickDashboard('894967889413237')">Dashboard USD</span>
            <span id="dbTabSettings_894967889413237" class="settingsContainer dashSettings" style="display:none;">
                <div id="topnav" class="topnav">
                    <a href="javascript:void(0)" class="signin" onclick="toggleTabSettingsMenu('894967889413237',true);">
                        <span><img src="/Content/Images/icon_gear.png" alt="Edit"></span>
                    </a>
                </div>
                <fieldset id="dbTabSettingsMenu_894967889413237" class="dashSettings-menu"> 
                    <ul class="dashboardEditMenu">
                        <img src="/Content/images/close.png" onclick="toggleTabSettingsMenu('894967889413237',false);" alt="tooltip" style="position:absolute;right:2px;top:2px;border:0;">
                        ...
                   </ul>
            </fieldset>
        </span>
    </li>
</ul>

我正在尝试选择每个标签并使用以下代码制作屏幕截图:

//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
    casper.wait(5000, function(){
        this.capture('home.png');
        var tabs = document.querySelectorAll('[id^=dbTabLabel]');
        var i;
        console.log('Tabs found: ' + tabs.length);
        for(i = 0; i < tabs.length; i++) {
            tabs.click()
            var name = 'tab' + i + '.png'
            this.capture(name); //Make a screenshot for each tab
        }
    })    
});

但它似乎没有选择任何标签,因为输出为Tabs found: 0

1 个答案:

答案 0 :(得分:1)

我建议使用

casper.each(tabs, function(self, tab){

};

取而代之的是for。此外,在querySelectorAll中使用更通用的选择器,例如ul#tabul li。我尝试在casperjs脚本中使用for循环并且总是出错,使用每次为我工作的每个和更多通用选择器!