How do I get data inside table / td

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

I use code below for get the cell value.

alert(document.getElementById("table-body-positions").rows[0].cells[3].innerHTML);

Td value is

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

I get result this.

<a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a>

But I just want to get 2019/01/04 13:36:19

Same problem here for this td.

<td><a data-action="update-limit" data-filter="limit">1.18809 (505.4)<br>$808.64</a></td>

asked Jan 4 at 16:52

Dorbagna

84111

well you are reading the innerHTML when you want to read the text.

– epascarello
Jan 4 at 17:03

add a comment |

I use code below for get the cell value.

alert(document.getElementById("table-body-positions").rows[0].cells[3].innerHTML);

Td value is

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

I get result this.

<a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a>

But I just want to get 2019/01/04 13:36:19

Same problem here for this td.

<td><a data-action="update-limit" data-filter="limit">1.18809 (505.4)<br>$808.64</a></td>

asked Jan 4 at 16:52

Dorbagna

84111

well you are reading the innerHTML when you want to read the text.

– epascarello
Jan 4 at 17:03

add a comment |

I use code below for get the cell value.

alert(document.getElementById("table-body-positions").rows[0].cells[3].innerHTML);

Td value is

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

I get result this.

<a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a>

But I just want to get 2019/01/04 13:36:19

Same problem here for this td.

<td><a data-action="update-limit" data-filter="limit">1.18809 (505.4)<br>$808.64</a></td>

asked Jan 4 at 16:52

Dorbagna

84111

I use code below for get the cell value.

alert(document.getElementById("table-body-positions").rows[0].cells[3].innerHTML);

Td value is

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

I get result this.

<a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a>

But I just want to get 2019/01/04 13:36:19

Same problem here for this td.

<td><a data-action="update-limit" data-filter="limit">1.18809 (505.4)<br>$808.64</a></td>

javascript

asked Jan 4 at 16:52

Dorbagna

84111

asked Jan 4 at 16:52

Dorbagna

84111

asked Jan 4 at 16:52

Dorbagna

84111

asked Jan 4 at 16:52

Dorbagna

84111

asked Jan 4 at 16:52

Dorbagna

84111

well you are reading the innerHTML when you want to read the text.

– epascarello
Jan 4 at 17:03

add a comment |

well you are reading the innerHTML when you want to read the text.

– epascarello
Jan 4 at 17:03

well you are reading the innerHTML when you want to read the text.

– epascarello
Jan 4 at 17:03

add a comment |

4 Answers
4

active

oldest

votes

Instead of InnerHTML, you can use innerText

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

answered Jan 4 at 17:02

Anoop Mc

787

add a comment |

Find each td by tag name and then recursively check its contents until a nodeType TEXT_NODE is found.

This works best if you do not have a fixed HTML structure within your tds as it would appear.

No ids and no classes needed.

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

answered Jan 4 at 17:19

kemicofa

10.8k44185

add a comment |

It would be easier if you could add a unique id, or class name to the span you are interested in.

Use innerText rather than innerHTML.

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

add a comment |

Your code seems over complicated just to get innerHTML alerts. Here is my solution. Codepen

HTML

<table id = "table-body-positions">

    <tr>

    <td><a data-action="details"><span><span id = "details">2019/01/04 13:36:19</span></span></a></td>

    <td><a data-action="update-limit" data-filter="limit"><span id = "limit">1.18809 (505.4)<br>$808.64</span></a></td>

    </tr>

</table>

let details = document.getElementById("details").innerHTML;

let limit = document.getElementById("limit").innerText;



alert(details);

alert(limit);

answered Jan 4 at 17:26

Arnas Dičkus

10419

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54043075%2fhow-do-i-get-data-inside-table-td%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

4 Answers
4

active

oldest

votes

4 Answers
4

active

oldest

votes

Instead of InnerHTML, you can use innerText

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

answered Jan 4 at 17:02

Anoop Mc

787

add a comment |

Instead of InnerHTML, you can use innerText

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

answered Jan 4 at 17:02

Anoop Mc

787

add a comment |

Instead of InnerHTML, you can use innerText

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

answered Jan 4 at 17:02

Anoop Mc

787

Instead of InnerHTML, you can use innerText

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

alert(document.getElementById("table-body-positions").rows[0].cells[1].innerText);

answered Jan 4 at 17:02

Anoop Mc

787

answered Jan 4 at 17:02

Anoop Mc

787

answered Jan 4 at 17:02

Anoop Mc

787

answered Jan 4 at 17:02

Anoop Mc

787

add a comment |

Find each td by tag name and then recursively check its contents until a nodeType TEXT_NODE is found.

This works best if you do not have a fixed HTML structure within your tds as it would appear.

No ids and no classes needed.

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

answered Jan 4 at 17:19

kemicofa

10.8k44185

add a comment |

Find each td by tag name and then recursively check its contents until a nodeType TEXT_NODE is found.

This works best if you do not have a fixed HTML structure within your tds as it would appear.

No ids and no classes needed.

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

answered Jan 4 at 17:19

kemicofa

10.8k44185

add a comment |

Find each td by tag name and then recursively check its contents until a nodeType TEXT_NODE is found.

This works best if you do not have a fixed HTML structure within your tds as it would appear.

No ids and no classes needed.

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

answered Jan 4 at 17:19

kemicofa

10.8k44185

Find each td by tag name and then recursively check its contents until a nodeType TEXT_NODE is found.

This works best if you do not have a fixed HTML structure within your tds as it would appear.

No ids and no classes needed.

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

function recursiveSearch(elem){

   

   if(elem.nodeType === Node.TEXT_NODE){

     //text was discovered

     return elem.data.replace("n", "").trim();

   }

   const nodes = elem.childNodes;

   return Object.keys(nodes).map(key=>recursiveSearch(nodes[key])).join("");

}



const tds = document.getElementsByTagName('td');

const res = Object.keys(tds).map(key=>{

  const td = tds[key];

  return recursiveSearch(td);

});



console.log(res);

<table>

  <td>

    <a data-action="details">

      <span>

    <span class="">2019/01/04 13:36:19</span>

      </span>

    </a>

  </td>

  <td>

    <a data-action="update-limit" data-filter="limit">

  1.18809 (505.4)<br>$808.64

   </a>

  </td>



</table>

answered Jan 4 at 17:19

kemicofa

10.8k44185

answered Jan 4 at 17:19

kemicofa

10.8k44185

answered Jan 4 at 17:19

kemicofa

10.8k44185

answered Jan 4 at 17:19

kemicofa

10.8k44185

add a comment |

It would be easier if you could add a unique id, or class name to the span you are interested in.

Use innerText rather than innerHTML.

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

add a comment |

It would be easier if you could add a unique id, or class name to the span you are interested in.

Use innerText rather than innerHTML.

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

add a comment |

It would be easier if you could add a unique id, or class name to the span you are interested in.

Use innerText rather than innerHTML.

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

It would be easier if you could add a unique id, or class name to the span you are interested in.

Use innerText rather than innerHTML.

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

console.log(document.getElementsByTagName('td')[0].getElementsByTagName('span')[1].innerText)

<table>

<td><a data-action="details"><span><span class="">2019/01/04 13:36:19</span></span></a></td>

</table>

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

edited Jan 4 at 17:13

answered Jan 4 at 17:01

mbunch

341313

answered Jan 4 at 17:01

mbunch

341313

answered Jan 4 at 17:01

mbunch

341313

add a comment |

Your code seems over complicated just to get innerHTML alerts. Here is my solution. Codepen

HTML

<table id = "table-body-positions">

    <tr>

    <td><a data-action="details"><span><span id = "details">2019/01/04 13:36:19</span></span></a></td>

    <td><a data-action="update-limit" data-filter="limit"><span id = "limit">1.18809 (505.4)<br>$808.64</span></a></td>

    </tr>

</table>

let details = document.getElementById("details").innerHTML;

let limit = document.getElementById("limit").innerText;



alert(details);

alert(limit);

answered Jan 4 at 17:26

Arnas Dičkus

10419

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

add a comment |

Your code seems over complicated just to get innerHTML alerts. Here is my solution. Codepen

HTML

<table id = "table-body-positions">

    <tr>

    <td><a data-action="details"><span><span id = "details">2019/01/04 13:36:19</span></span></a></td>

    <td><a data-action="update-limit" data-filter="limit"><span id = "limit">1.18809 (505.4)<br>$808.64</span></a></td>

    </tr>

</table>

let details = document.getElementById("details").innerHTML;

let limit = document.getElementById("limit").innerText;



alert(details);

alert(limit);

answered Jan 4 at 17:26

Arnas Dičkus

10419

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

add a comment |

Your code seems over complicated just to get innerHTML alerts. Here is my solution. Codepen

HTML

<table id = "table-body-positions">

    <tr>

    <td><a data-action="details"><span><span id = "details">2019/01/04 13:36:19</span></span></a></td>

    <td><a data-action="update-limit" data-filter="limit"><span id = "limit">1.18809 (505.4)<br>$808.64</span></a></td>

    </tr>

</table>

let details = document.getElementById("details").innerHTML;

let limit = document.getElementById("limit").innerText;



alert(details);

alert(limit);

answered Jan 4 at 17:26

Arnas Dičkus

10419

Your code seems over complicated just to get innerHTML alerts. Here is my solution. Codepen

HTML

<table id = "table-body-positions">

    <tr>

    <td><a data-action="details"><span><span id = "details">2019/01/04 13:36:19</span></span></a></td>

    <td><a data-action="update-limit" data-filter="limit"><span id = "limit">1.18809 (505.4)<br>$808.64</span></a></td>

    </tr>

</table>

let details = document.getElementById("details").innerHTML;

let limit = document.getElementById("limit").innerText;



alert(details);

alert(limit);

answered Jan 4 at 17:26

Arnas Dičkus

10419

answered Jan 4 at 17:26

Arnas Dičkus

10419

answered Jan 4 at 17:26

Arnas Dičkus

10419

answered Jan 4 at 17:26

Arnas Dičkus

10419

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

add a comment |

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

Unfortunately i can't use span id instead of span class.I can't manipulate anything just call from another web site.Thank you for answer.

– Dorbagna
Jan 4 at 18:16

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Bdtjtk