I want to read an html tag which has formatted text. using javascript

Question

I want to read an html tag which has formatted text. For example

<p id="strike" onMouseOver="getP()><b>Hello</b></p> // paragraph Tag with formatted text

if i am calling a function,

 function getP()
 {  
       var val=document.getElementById('strike').value; 
    alert(val);
 }

am getting undefined in alert, how to get the exact bold formatted text or bold tag with text....Please help me out in this

.textContent returns the plaintext, .innerHTML returns the HTML. There's no way to alert a boldfaced piece of text. — Rob W
– Rob W, Commented Jul 30, 2012 at 11:08
@Rob: I don't think he wants to alert it formatted, just to retrieve the text from the b element, and alert that. — David Thomas
– David Thomas, Commented Jul 30, 2012 at 15:21

Dr. Dan · Accepted Answer · 2012-07-30 11:07:44Z

4

var val=document.getElementById('strike').innerHTML; 
    alert(val);

answered Jul 30, 2012 at 11:07

Dr. Dan

2,28816 silver badges19 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Danil Speransky · Accepted Answer · 2012-07-30 11:08:58Z

0

Use alert(document.getElementById('strike').innerHTML);

answered Jul 30, 2012 at 11:08

Danil Speransky

30.5k6 gold badges70 silver badges78 bronze badges

Comments

xdazz · Accepted Answer · 2012-07-30 11:11:36Z

0

p does not have value property. You need to get the first childNode which is b, and access the innerHTML property.

   var val=document.getElementById('strike').childNodes[0].innerHTML;

answered Jul 30, 2012 at 11:11

xdazz

161k38 gold badges255 silver badges278 bronze badges

Comments

David Thomas · Accepted Answer · 2012-07-30 11:17:21Z

0

I'd suggest using:

function getP() {  
   var el = document.getElementById('strike').getElementsByTagName('b')[0],
       text = el.textContent ? el.textContent : el.innerText;
   alert(text);
}

JS Fiddle demo.

Updated the above, and generalised some:

<script type="text/javascript">
function getP(el,tagtype) {
    if (!el || !tagtype) {
        return false;
    }
    else {
        var textFrom = el
    .getElementsByTagName(tagtype)[0],
            text = textFrom.textContent ? textFrom.textContent : textFrom.innerText;
   console.log(text);
    }
}
</script>

<p id="strike" onMouseOver="getP(this, 'b')"><b>Hello</b></p>

JS Fiddle demo.

edited Jul 30, 2012 at 11:17

answered Jul 30, 2012 at 11:09

David Thomas

254k53 gold badges382 silver badges421 bronze badges

1 Comment

Rob W Over a year ago

Don't use el.textContent to check whether 'textContent' is supported. When it's an empty string, It will be false when coerced to a boolean. The correct way to check whether it's supported is document.textContent === null. This follows from the fact that a node of type DOCUMENT_NODE has a textContent property which is equal to null (per specification). Example: text = el[document.textContent === null ? 'textContent' : 'innerText'];

Dr. Dan · Accepted Answer · 2012-07-31 07:10:18Z

0

var val=document.getElementById('strike').innerHTML;

answered Jul 31, 2012 at 7:10

Dr. Dan

2,28816 silver badges19 bronze badges

Collectives™ on Stack Overflow

I want to read an html tag which has formatted text. using javascript

5 Answers 5

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related