我需要废弃网页并点击网络上的多个标签。 我正在检查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
答案 0 :(得分:1)
我建议使用
casper.each(tabs, function(self, tab){
};
取而代之的是for
。此外,在querySelectorAll
中使用更通用的选择器,例如ul#tabul li
。我尝试在casperjs脚本中使用for循环并且总是出错,使用每次为我工作的每个和更多通用选择器!