i am trying to get the value Lotus of the h4 tag from the code below

    <a id="linkSale" class="linkAccess" title="" href="/vp4/Home/Handlers/OperationAccess.ashx?operationid=17285" onclick="javascript:PrepareEventOnLinksAnchor(17285);">

    <h4>Lotus</h4>

    <p class="dateSales">Du <em><strong>mercredi&nbsp;1 mai</strong>&nbsp;9h</em> au <em><strong>dimanche&nbsp;5 mai</strong>&nbsp;6h</em> </p>

    <p class="baseline"></p>

    </a>    

to do that i did as follow :

var h=document.getElementById("17285");

var i=h.getElementsByTagName("h4");

which returned the following line :

<h4>Lotus</h4>

what I want is to get the value Lotus converted to a text.

i am trying to get the value Lotus of the h4 tag from the code below

    <a id="linkSale" class="linkAccess" title="" href="/vp4/Home/Handlers/OperationAccess.ashx?operationid=17285" onclick="javascript:PrepareEventOnLinksAnchor(17285);">

    <h4>Lotus</h4>

    <p class="dateSales">Du <em><strong>mercredi&nbsp;1 mai</strong>&nbsp;9h</em> au <em><strong>dimanche&nbsp;5 mai</strong>&nbsp;6h</em> </p>

    <p class="baseline"></p>

    </a>    

to do that i did as follow :

var h=document.getElementById("17285");

var i=h.getElementsByTagName("h4");

which returned the following line :

<h4>Lotus</h4>

what I want is to get the value Lotus converted to a text.

• javascript

• did you looked here: stackoverflow./questions/5321739/… – Ivan Chernykh Commented May 4, 2013 at 10:42
• BTW: id's must not be numbers only, they have to start with a character at least – Fabian Lauer Commented May 4, 2013 at 10:43
• Numbers are allowed in html5 – mplungjan Commented May 4, 2013 at 10:45

5 Answers 5

Any of these will work - I remend the last

console.log(
  document.getElementById("linkSale").getElementsByTagName("h4")[0].textContent,
  document.getElementById("linkSale").querySelector("h4").textContent,
  document.querySelector("#linkSale h4").textContent
)

<a id="linkSale" class="linkAccess" title="" href="/vp4/Home/Handlers/OperationAccess.ashx?operationid=17285">
  <h4>Lotus</h4>
  <p class="dateSales">Du <em><strong>mercredi&nbsp;1 mai</strong>&nbsp;9h</em> au <em><strong>dimanche&nbsp;5 mai</strong>&nbsp;6h</em> </p>
  <p class="baseline"></p>
</a>

you can use jQuery for that :

<h4 id="title">Lotus</h4>

to include script on top:

<script>[[jQuery .js File Path]]</script>

On document ready do like this:

$(document).ready(){ 
     var text=$('#title').html();
});

but I would remend to use id.

You can use "innerHTML" in your example.

 var text = h.getElementsByTagName("h4")[0].innerHTML;

Or "innerText"

var text = h.getElementsByTagName("h4")[0].innerText

I highly remend you use jQuery for this type of work. With jQuery, it's pretty easy:

var i = $('h4').text();

However, whenever you can - use the id attribute.

<h4 id="doc_head">Lotus</h4>

Then in JS:

var i = $('#doc_head').text();

If you don't want to use jQuery for some reason - get the text like that (ugly):

var i = h.textContent || h.innerText; // having your DOM object in h

The above should work in both IE and W3C pliant browsers, look here - InnerText alternative in mozilla

You can use jQuery for that :

<h4 id="title">Lotus</h4>

to include script on top:

<script>[[jQuery .js File Path]]</script>

On document ready do like this:

$(document).ready(){ 
     var text=$('#title').html();
});

but I would remend to use id's or classes