How to get span value

Question

There are a piece of code but can not use  lt id gt  tag   So how do I get to the  lt span gt  1 2 3 4    lt div id  test  gt       lt span gt 1 lt  span gt       lt span gt 2 lt  span gt       lt span gt 3 lt  span gt       lt span gt 4 lt  span gt   lt div gt

User · Answer

You can use querySelectorAll to get all span elements and then use new ES2015 (ES6) spread operator convert StaticNodeList that querySelectorAll returns to array of spans, and then use map operator to get list of items.

See example bellow

_x000D_

([...document.querySelectorAll('#test span')]).map(x => console.log(x.innerHTML))

_x000D_

<div id="test">_x000D_
    <span>1</span>_x000D_
    <span>2</span>_x000D_
    <span>3</span>_x000D_
    <span>4</span>_x000D_
<div>

_x000D_

User · Answer

Pure javascript would be like this  var children   document getElementById  test   children    If you are using jQuery it would be like this      test   children

User · Answer

You need to change your code as below -   lt html gt   lt body gt    lt span id  span Id  gt Click the button to display the content  lt  span gt    lt button onclick  displayDate    gt Click Me lt  button gt    lt script gt  function displayDate        var span Text   document getElementById  span Id   innerText     alert  span Text      lt  script gt   lt  body gt   lt  html gt    After doing this you will get the  tag value in alert

User · Answer

var test   document getElementById   test         To get the text only  you can use  textContent  console log  test textContent        1 2 3 4    textContent is the standard way  innerText is the property to use for legacy IE  If you want something as cross browser as possible  recursively use nodeValue

User · Answer

No jQuery tag  so I m assuming pure JavaScript  var spanText   document getElementById  targetSpanId   innerText    Is what you need  But in your case   var spans   document getElementById  test   getElementsByTagName  span     returns node-list of spans for  var i 0 i lt spans length i          console log spans i  innerText    logs 1 for i     0  2 for i     1 etc     Here s a fiddle

User · Answer

Try this  var div   document getElementById  test    var spans   div getElementsByTagName  span     for i 0 i lt spans length i        alert spans i  innerHTML

User · Answer

lt div id  test  gt       lt span gt 1 lt  span gt       lt span gt 2 lt  span gt       lt span gt 3 lt  span gt       lt span gt 4 lt  span gt   lt  div gt   lt div id  test2  gt  lt  div gt    lt script type  text javascript  gt      var getDiv   document getElementById  test        var getSpan   getDiv getElementsByTagName  span           var divDump   document getElementById  test2         for  var i 0  i lt getSpan length  i              divDump innerHTML   divDump innerHTML         getSpan i  innerHTML         lt  script gt

[javascript] How to get < span > value?

Examples related to javascript