sean z
sean z

Reputation: 21

How to get text of element but excluding the sub-elements text

I want to get the text of the element without including the text of its elements. I have tried getText(), but it returns text that includes all the child elements text.

In the following example: When I retrieved text from the first div, it returns text that includes all its subelements.

<div class="row”>
    <div class="col-lg-4 section”>
        <div class="col-md-12”>
            inseam 28 30 32
        </div> 
    </div>
        <div class="col-lg-5 section”>
        <div class="col-md-13”>
            inseam 28 34 36
        </div> 
    </div>
</div>

Please let me know how to do this using webdriver in java.

Thanks sean

Upvotes: 2

Views: 4236

Answers (4)

EduGord
EduGord

Reputation: 159

I've been searching for the same thing for a while, here's my solution for those who can specify a WebElement or a list of WebElements:

def remove_child_text_from_webelement(webelement):
    # Declaring the current text for this webelement
    current_text = webelement.text
    # Getting its childs elements in a list
    childs_list = webelement.find_elements_by_xpath('./*')
    # Manipulating text to remove child text from parents
    childrens_text_list = [child.text for child in childs_list]
    #return (childrens_text_list,type(childrens_text_list))
    for children_text in childrens_text_list:
        match_index = current_text.find(children_text)
        if match_index != -1:
            match_length = len(children_text)
            current_text = current_text[0:match_index] + current_text[match_index+match_length:]
    return current_text

Now you can do something like:

[remove_child_text_from_webelement(e) for e in browser.find_elements_by_xpath('//div[contains(@class,"person")]')]

Upvotes: 1

Shesh Patel
Shesh Patel

Reputation: 1

This is happening because you are trying to get the text of parent tag. If you want to get tag of particular child, you have to reach all the way there. You can take use of "nth-child" or "nth-of-type". For e.g in this case, if you want to have return this text "inseam 28 34 36".

The CSS selector will be "div.row div:nth-of-type(3)" or you can directly specify the div class "div.col-md-13"

You can refer to this article on more on selectors https://saucelabs.com/resources/selenium/css-selectors

Upvotes: 0

iCollect.it Ltd
iCollect.it Ltd

Reputation: 93551

Not tried it specifically with Selenium, but with jQuery you can use contents() to get all elements including raw text nodes, filter by nodeType 3 (text nodes) and then take the first, in your example:

JSFiddle: http://jsfiddle.net/TrueBlueAussie/p33gcfk2/1/

var text = $('.row').contents().filter(function () {
    return this.nodeType == 3;
}).first();
alert(text.text());

Upvotes: 0

Subh
Subh

Reputation: 4424

When I retrieved text from the first div with class 'row', it returns text that includes all its subelements.

  • This happened because you retrieved text from the parent div and hence all the innerHTML/text of the child divs were retrieved along with them.

Below is the way to retrieve the necessary innerHTML/text only:

1- for 'inseam 28 30 32':

String text = driver.findElement(By.xpath("//div[@class='col-md-12']")).getText();

OR

String text = driver.findElement(By.className("col-md-12")).getText();

2- for 'inseam 28 34 36':

String text = driver.findElement(By.xpath("//div[@class='col-md-13']")).getText();

OR

String text = driver.findElement(By.className("col-md-13")).getText();

Upvotes: 0

Related Questions