How do I get the text inside of a div which also has another element?

Question

<p id="mydiv">
<img alt="Assets Received" src="/images/icons/statuses/generic.png" title="" height="16" width="16"> I want to get this text only, not the image element before me
</p>

I want to retrieve the text inside of mydiv excluding the image tag. fiddle https://jsfiddle.net/Town/5L3rd/

If you, like in this case, always have the text being the last node you could always use; `alert(document.getElementById('mydiv').lastChild);` Works on IE 6 and up. — dojs, Mar 12 '15 at 17:05

score 1 · Answer 1 · answered Mar 12 '15 at 17:00

1

In modern browsers this property is called textContent:

document.getElementById('mydiv').textContent // " I want to get this text only, not the image element before me"

If you want to support rocks and dust (IE8), you also need to check the innerText property. Together you can create a function to anonymously get the text:

function getText(el){
    return el.textContent || el.innerText;
}

answered Mar 12 '15 at 17:00

Eric

18,532
2
34
39

does this work in IE8? – Dinǝsh Gupta Mar 12 '15 at 17:01
innerText does not work, it gives undefined – Dinǝsh Gupta Mar 12 '15 at 17:03
@DinǝshGupta Look at my newer edit. `innerText` is unsupported in modern browsers; therefore you need the check to either return `textContent`, and if not defined, the `innerText`. – Eric Mar 12 '15 at 17:04
On a compliant browser, `el.innerText` will be `undefined` and `el.textContent` might be `""`. But `"" || undefined` is `undefined`. Using `el.textContent || el.innerText || ''` may be better. – Oriol Mar 12 '15 at 17:05
@Eric check my edit.. added a fiddle link – Dinǝsh Gupta Mar 12 '15 at 17:08

How do I get the text inside of a div which also has another element?

1 Answers1