How should I get the Parent nodeName of a text while I'm on it with the cursor?

<div id="holder" contentEditable="true">
    Stackoverflow is the <b>coolest</b> Q&A website in the world.
</div>

And as a result we have:

• Stackoverflow is the coolest Q&A website in the world.

So if the cursor is on the coolest I would like to get it's parent nodeName which is b

Please no libraries, just pure javascript.

How should I get the Parent nodeName of a text while I'm on it with the cursor?

<div id="holder" contentEditable="true">
    Stackoverflow is the <b>coolest</b> Q&A website in the world.
</div>

And as a result we have:

• Stackoverflow is the coolest Q&A website in the world.

So if the cursor is on the coolest I would like to get it's parent nodeName which is b

Please no libraries, just pure javascript.

• javascript
• text
• range
• parent

Share Improve this question Follow edited Feb 3, 2011 at 21:52 Adam Halasz asked Feb 3, 2011 at 21:26 Adam HalaszAdam Halasz 58.4k6767 gold badges153153 silver badges216216 bronze badges 1

• Are you okay with a jQuery solution? – Matt Ball Commented Feb 3, 2011 at 21:33

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

if (document.addEventListener) {
    document.getElementById('holder').addEventListener('mouseover', function (e) {
        somevar = e.target.nodeName;
    }, false);
} else {
    document.getElementById('holder').attachEvent('onmouseover', function (e) {
        somevar = e.srcElement.nodeName;
    });
}

EDIT: updated code and example in accordance with question edit and ments.

See example.

<div id="holder" contentEditable="true">
   Stackoverflow is the <b onclick="alert(this.tagName)">coolest</b> Q&A website in the world.
</div>