For instance, I'm looking to find the coordinates of the text "The" in this wikipedia page after it is rendered, much like the coordinates given by chrome's developer view. Screenshot of developer options
<div>The <b>Eagles</b> are an American <a href="/wiki/Rock_music" title="Rock music">rock</a> band formed in Los Angeles in 1971. With five number-one singles and six number-one albums, six <a href="/wiki/Grammy_Award" class="mw-redirect" title="Grammy Award">Grammy Awards</a> and five <a href="/wiki/American_Music_Award" class="mw-redirect" title="American Music Award">American Music Awards</a>, the Eagles were one of the most successful musical acts of the 1970s in North America. Founding members <a href="/wiki/Glenn_Frey" title="Glenn Frey">Glenn Frey</a> (guitars, vocals), <a href="/wiki/Don_Henley" title="Don Henley">Don Henley</a> (drums, vocals), <a href="/wiki/Bernie_Leadon" title="Bernie Leadon">Bernie Leadon</a> (guitars, vocals) and <a href="/wiki/Randy_Meisner" title="Randy Meisner">Randy Meisner</a> (bass guitar, vocals) were recruited by <a href="/wiki/Linda_Ronstadt" title="Linda Ronstadt">Linda Ronstadt</a> as band members, some touring with her, and all playing on her <a href="/wiki/Linda_Ronstadt_(album)" title="Linda Ronstadt (album)">third solo album</a>, before venturing out on their own on <a href="/wiki/David_Geffen" title="David Geffen">David Geffen</a>'s new <a href="/wiki/Asylum_Records" title="Asylum Records">Asylum Records</a> label. </div>
I've already tried innerHTML (element.innerHTML) which just returns the size of the div, and a few other things, but nothing seems to be quite right.
You can use the createRange() function to select your text from the article. This function selects Nodes.
Assuming that you're using this wikipedia page https://en.wikipedia.org/wiki/Eagles_(band), you will have to use the 7th paragraph of the page.
// Getting the 7th HTML paragraph element
const paragraphElement = document.querySelector('p:nth-child(7)');
const range = document.createRange();
range.setStart(paragraphElement , 0);
// Selecting the first Node only
range.setEnd(paragraphElement, 1);
const rects = range.getClientRects();
// The node location is in the rects object
console.log(rects);