首页 > 解决方案 > 使用 CSS 选择器按下一个元素提取跨度文本

问题描述

我有这段 html

<div class="crtoolbar" style="display:inline-block;height:26px;width:1080px;top:0px;left:0px;">
    <table cellspacing="0" cellpadding="0">
        <tbody>
            <tr nowrap="">
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl01" title="Print" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/print.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/print_over.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/print.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl04" disabled="disabled" title="First" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/firstd.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/firstd.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/firstd.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="4">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl05" disabled="disabled" title="Prev" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/prevd.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/prevd.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/prevd.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl06" title="Next" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/next.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/next_over.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/next.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl07" title="Last" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/last.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/last_over.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/last.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="4">&nbsp;</td>
                <td nowrap="" valign="middle" align="center" width="60px">
                    <span style="display:inline-block;width:60px;">1&nbsp;/&nbsp;5</span>
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="40px">
                    <input name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl09" type="text" title="Go To" class="crtoolbartextbox" onkeypress="if ((event.which &amp;&amp; event.which == 13) || (event.keyCode &amp;&amp; event.keyCode == 13)) { document.getElementById('ctl00_ContentPlaceHolder1_CrystalReportViewer1_ctl02_ctl10').click(); return false;}" style="height:16px;width:40px;">
                </td>
                <td nowrap="" width="1">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl10" id="ctl00_ContentPlaceHolder1_CrystalReportViewer1_ctl02_ctl10" title="Go To" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/gotopage.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/gotopage_over.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/gotopage.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="95px">
                    <input name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl13" type="text" title="Find" class="crtoolbartextbox" onkeypress="if ((event.which &amp;&amp; event.which == 13) || (event.keyCode &amp;&amp; event.keyCode == 13)) { document.getElementById('ctl00_ContentPlaceHolder1_CrystalReportViewer1_ctl02_ctl14').click(); return false;}" style="height:16px;width:95px;">
                </td>
                <td nowrap="" width="1">&nbsp;</td>
                <td nowrap="" width="22px">
                    <input type="image" name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl14" id="ctl00_ContentPlaceHolder1_CrystalReportViewer1_ctl02_ctl14" title="Find" src="/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/search.gif" onmouseover="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/search_over.gif'" onmouseout="this.src='/aspnet_client/system_web/2_0_50727/CrystalReportWebFormViewer3/images/toolbar/search.gif'" style="height:22px;width:22px;border-width:0px;">
                </td>
                <td nowrap="" width="8">&nbsp;</td>
                <td nowrap="" width="">
                    <select name="ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl15" onchange="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl15\',\'\')', 0)" title="Zoom" class="crtoolbarlist" style="height:22px;">
                        <option value="25">25%</option>
                        <option value="50">50%</option>
                        <option value="75">75%</option>
                        <option selected="selected" value="85">85%</option>
                        <option value="100">100%</option>
                        <option value="125">125%</option>
                        <option value="150">150%</option>
                        <option value="200">200%</option>
                        <option value="300">300%</option>
                        <option value="400">400%</option>
                    </select>
                </td>
                <td nowrap="" width="100%"></td>
            </tr>
        </tbody>
    </table>
</div>

我需要使用 css 选择器依赖这个元素

.FindElementByCss("[name='ctl00$ContentPlaceHolder1$CrystalReportViewer1$ctl02$ctl07']")

这是提取所需的 span 标签部分的快照 在此处输入图像描述

所以最后我需要提取前面的数字</span></td>,这里是 5,如图所示

标签: excelvbaseleniumweb-scrapingcss-selectors

解决方案


您可以使用属性 = 值选择器

[style='display:inline-block;width:60px;']

然后使用 split 或 replace 得到 / 之后的 5

其他地方也存在相同的信息,您可以使用类选择器

.crtoolbar

然后拆分它的innerText:

Split(element.innerText, Chr$(32))(2)

最后一个将比任何 xpath 更快(除非使用非常旧的 IE 版本,在这种情况下可能更快或大致相同。


推荐阅读