Question

0

73

Views

Use XPath to select all values on a page and replace content

I want to replace every instance of the word "Specialization" with "Profession." This is the XPath code I have so far:

<script type="text/javascript">

var xpath = "//div[text()='Specialization']"; 
var matchingElement = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
matchingElement.style.color = "red";

</script>

My thanks to @Mateen for their help with my original question for writing the above line for me in the first place.

5 months ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-03T18:18:01.930Z

Not sure why you need an XPath solution, but if you want to stick with the standard DOM API, here's a simple solution.

document.querySelectorAll("div").forEach(function(d){
  if(d.textContent.includes("Foo")){
    d.textContent = d.textContent.replace("Foo","FooBar");
    d.classList.add("match");
  }
});

.match { color:#f00; }

<div>Foo is cool</div>
<div>Bar is not</div>
<div>Foo is cool</div>
<div>Bar is not</div>
<div>Foo is cool</div>
<div>Bar is not</div>
<div>Foo is cool</div>
<div>Bar is not</div>
<div>Foo is cool</div>
<div>Bar is not</div>
<div>Foo is cool</div>
<div>Bar is not</div>