0

I know it's possible in selenium, to find a specific element by a text that the element contains. I have an example code for this:

the_element = browser.find_element_by_xpath("//span[contains(.,TEXT)]")

Now is that possible to do with only javascript? There are ways in javascript to find an element by it's selector, but does it work to find an element by a specific text that it contains?

The element I'm working with is this:

<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">28</span>

I want to find the element by the number (28) that it contains.

If somebody knows how to that, that would be awesome.

programming_for_fun
  • 79
  • 1
  • 3
  • 10

2 Answers2

1

Get a collection of just the span elements (or the elements in a particular section of your document where you know you want to look). Loop through the elements and check their textContent for your value.

document.querySelectorAll("span").forEach(function(element){
  if(element.textContent.includes("28")){
    console.log(element);
  }
});
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">21</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">22</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">22</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">23</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">24</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">25</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">26</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">27</span>
<span class="_7Cm1F9 ka2E9k uMhVZi dgII7d z-oVg8 pVrzNP">28</span>
Scott Marcus
  • 64,069
  • 6
  • 49
  • 71
  • Thank's for your answer! The Javascript should be as efficient as possible, so I think that is not the best solution for my case. But thank you anyways – programming_for_fun May 29 '21 at 21:27
  • @programming_for_fun There is nothing inherently inefficient here. This is how you find one of many elements based on its text in JavaScript. – Scott Marcus May 29 '21 at 21:55
  • You're right. Furthermore it's working, I was just looking for something else, then looping trough every span element. But I guess looping through everything wouldn't even make a big time difference. Anyways I found what I was searching for, so I'm very happy. – programming_for_fun May 29 '21 at 22:03
0

The way to locate elements doesn't change based on the language bindings (except syntax). This xpath should work:

the_elements = browser.find_elements_by_xpath("//span[text()='28']")
for element in the_elements:
    // do whatever here

EDIT: Here's the same code in Javascript:

var elements = driver.findElement(By.xpath("//span[text()='28']"));
for (var e : elements)
{
    // Do something
}
C. Peck
  • 3,641
  • 3
  • 19
  • 36
  • so I can use that same code in Javascript? Because it's actually written in Python – programming_for_fun May 29 '21 at 21:23
  • Oh, I just extended your python example. You want it to run in a JavascriptExecutor? If so, why? – C. Peck May 29 '21 at 21:25
  • I want to make a Javascript, that I can execute in a browser, that can click specific elements/buttons. – programming_for_fun May 29 '21 at 21:30
  • Why do you need to use javascript? Why can't you use Selenium's normal methods to identify elements? – C. Peck May 29 '21 at 21:32
  • Actually I think I could make a Selenium based version really easy, but the thing is, executing it in a browser is way faster then Selenium. Furthermore Selenium get's blocked by many sites, who are detecting the webdriver. – programming_for_fun May 29 '21 at 21:36
  • The second example is **Java**, not **JavaScript**. [What's the difference between JavaScript and Java](https://stackoverflow.com/questions/245062/whats-the-difference-between-javascript-and-java) – Emiel Zuurbier May 29 '21 at 21:36
  • First of all, thank you for your second example. But the problem is, that you are using a webdriver in it. I need just clean javascript, no drivers etc. For example something like this: document.evaluate('XPATH', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue; That's how you find an element by it's xpath in javascript, but i need to find the element by its text that it contains. – programming_for_fun May 29 '21 at 21:45
  • OK, sorry unfortunately my expertise is with Selenium so if you aren't looking for a Selenium solution I likely can't help (and if that's the case let's remove the selenium tag from your question. I hope someone is able to help you solve this! – C. Peck May 29 '21 at 21:47
  • That's no problem, you helped anyways, that's what's matter. I'm happy to be able to say, that I found the answer. – programming_for_fun May 29 '21 at 21:57
  • Cool! If you found your solution, you should answer you own question :) – C. Peck May 29 '21 at 22:05