写Xpath以根据上部字段选择字段

时间:2017-11-29 14:27:41

标签: jquery html xpath

我不是xpath专家,尝试过很多来自互联网的解决方案,但仍然无法选择特定领域。

Html:

<div class="WJYM">
    <ul class="WEXM WMXM" role="list">
        <li class="WKWM WAYM" role="listitem" data-automation-id="formLabelRequired">
            <div class="WMWM WCWM">
                <label id="56$383927--uid80-formLabel" data-automation-id="formLabel">Category</label>
                <div class="WNWM wd-036e7e5d-ab15-4210-a313-bcfdb6b9bac2" aria-hidden="true">Category</div>
            </div>
            <div class="WOWM">
                <div class="WOXH">
                    <div class="WKPV WAPV WHOV WJ3 WJUV WPOV WNQV" data-automation-id="responsiveMonikerInput" id="56$383927--uid80" tabindex="-2">
                        <div class="WMWP WLVP WAWP" style="opacity: 0;" data-automation-hiddensearch="false">
                            <input type="text" class="gwt-TextBox WKWP" autocomplete="off" placeholder="search" tabindex="0" aria-invalid="false" aria-labelledby="56$383927--uid80-formLabel" aria-required="true"><span class="WMVP"><div role="presentation" data-automation-id="icon" class="WEHJ WDHJ WNVP"><svg viewBox="0 0 24 24" role="presentation" focusable="false" class="wd-icon-x wd-icon" height="24" width="24" xmlns="http://www.w3.org/2000/svg">
    <g class="wd-icon-container" fill-rule="evenodd">
        <g>
            <path class="wd-icon-fill" d="M5.996 4.582a.5.5 0 0 0-.717-.003l-.7.7a.504.504 0 0 0 .003.717L10.586 12l-6.004 6.004a.5.5 0 0 0-.003.717l.7.7c.197.197.514.2.717-.003L12 13.414l6.004 6.004a.5.5 0 0 0 .717.003l.7-.7a.504.504 0 0 0-.003-.717L13.414 12l6.004-6.004a.5.5 0 0 0 .003-.717l-.7-.7a.504.504 0 0 0-.717.003L12 10.586 5.996 4.582z"/>
        </g>
    </g>
</svg>
</div><div role="presentation" data-automation-id="icon" class="WEHJ WDHJ WHWP"><svg viewBox="0 0 24 24" role="presentation" focusable="false" class="wd-icon-prompts wd-icon" height="24" width="24" xmlns="http://www.w3.org/2000/svg">
    <g class="wd-icon-container" fill-rule="evenodd">
        <g>
            <path class="wd-icon-fill" d="M4 6.505C4 6.226 4.214 6 4.505 6h.99c.279 0 .505.214.505.505v.99A.497.497 0 0 1 5.495 8h-.99A.497.497 0 0 1 4 7.495v-.99zm0 5c0-.279.214-.505.505-.505h.99c.279 0 .505.214.505.505v.99a.497.497 0 0 1-.505.505h-.99A.497.497 0 0 1 4 12.495v-.99zm0 5c0-.279.214-.505.505-.505h.99c.279 0 .505.214.505.505v.99a.497.497 0 0 1-.505.505h-.99A.497.497 0 0 1 4 17.495v-.99zm4-10C8 6.226 8.229 6 8.5 6h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99zm0 5c0-.279.229-.505.5-.505h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99zm0 5c0-.279.229-.505.5-.505h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99z"/>
        </g>
    </g>
</svg>
</div></span>
                            <div role="presentation" data-automation-id="icon" class="WEHJ WDHJ WLWP">
                                <svg viewBox="0 0 24 24" role="presentation" focusable="false" class="wd-icon-search wd-icon" height="24" width="24" xmlns="http://www.w3.org/2000/svg">
                                    <g class="wd-icon-container" fill-rule="evenodd">
                                        <g fill-rule="nonzero">
                                            <path class="wd-icon-background" d="M16.896 14.775l3.643 3.642a.995.995 0 0 1-.004 1.418l-.7.7c-.39.39-1.032.39-1.418.004l-3.642-3.643a7 7 0 1 1 2.121-2.121zM11 16a5 5 0 1 0 0-10 5 5 0 0 0 0 10z" />
                                            <path class="wd-icon-fill" d="M17.32 15.906l2.859 2.858a.5.5 0 0 1 .003.717l-.7.7a.5.5 0 0 1-.718-.002l-2.858-2.86a8 8 0 1 1 1.414-1.414zM11 17a6 6 0 1 0 0-12 6 6 0 0 0 0 12z" />
                                        </g>
                                    </g>
                                </svg>
                            </div><span class="WOWP"></span></div>
                        <div class="gwt-Label WKQV">search input</div>
                        <div class="WPPV">
                            <ul tabindex="-2" class="WIBP WOPV WNBP" role="listbox" data-automation-id="selectedItemList"></ul>
                        </div><span class="WHQV" aria-hidden="true" data-automation-id="promptIcon" tabindex="-2" aria-invalid="false"><div data-automation-id="icon" class="WEHJ WDHJ WIQV"><svg viewBox="0 0 24 24" role="presentation" focusable="false" class="wd-icon-prompts wd-icon" height="24" width="24" xmlns="http://www.w3.org/2000/svg">
    <g class="wd-icon-container" fill-rule="evenodd">
        <g>
            <path class="wd-icon-fill" d="M4 6.505C4 6.226 4.214 6 4.505 6h.99c.279 0 .505.214.505.505v.99A.497.497 0 0 1 5.495 8h-.99A.497.497 0 0 1 4 7.495v-.99zm0 5c0-.279.214-.505.505-.505h.99c.279 0 .505.214.505.505v.99a.497.497 0 0 1-.505.505h-.99A.497.497 0 0 1 4 12.495v-.99zm0 5c0-.279.214-.505.505-.505h.99c.279 0 .505.214.505.505v.99a.497.497 0 0 1-.505.505h-.99A.497.497 0 0 1 4 17.495v-.99zm4-10C8 6.226 8.229 6 8.5 6h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99zm0 5c0-.279.229-.505.5-.505h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99zm0 5c0-.279.229-.505.5-.505h11c.276 0 .5.214.5.505v.99a.506.506 0 0 1-.5.505h-11a.495.495 0 0 1-.5-.505v-.99z"/>
        </g>
    </g>
</svg>
</div></span></div>
                </div>
            </div>
        </li>
        <li class="WKWM" role="listitem">
            <div class="WMWM WCWM">
                <label id="56$383068--uid81-formLabel" data-automation-id="formLabel" for="56$383068--uid81-input">Comment</label>
                <div class="WNWM wd-036e7e5d-ab15-4210-a313-bcfdb6b9bac2" aria-hidden="true">Comment</div>
            </div>
            <div class="WOWM">
                <div class="WOXH WPXH">
                    <div class="WIMY textArea WBMY WJ3" data-automation-id="textArea" id="56$383068--uid81">
                        <textarea class="gwt-TextArea WMMY WANY WBNY" data-automation-id="textAreaField" role="textbox" aria-label="Process Comment" id="56$383068--uid81-input" aria-invalid="false" tabindex="0"></textarea>
                    </div>
                </div>
            </div>
        </li>
    </ul>
</div>

有关网页中字段显示方式的屏幕截图: enter image description here

我想根据名为Comment的上方框选择Category

我有两个单独的xpath:

类别:

//label[text()='Category']/../following-sibling::div//span[contains(@data-automation-id,'promptIcon')]

评论: //label[text()='Comment']

我不能单独使用Comment的xpath来选择它,因为网页上有其他一些评论字段,而且我得到了多个值。

所以我只想选择跟随comment field的{​​{1}}。

我尝试了Category dropdown这两个字段的一些技巧,但它没有用。

1 个答案:

答案 0 :(得分:1)

我们的想法是检查这两个元素的共同点是什么,它们都是li,其中包含label个标记,这个xpath应该可以完成工作:

//li[.//label[text()="Category"]]/following-sibling::li//label[text()="Comment"]