Maison  >  Article  >  interface Web  >  Un exemple simple d'obtention du contenu de chaque tr et td du nœud de table en js

Un exemple simple d'obtention du contenu de chaque tr et td du nœud de table en js

高洛峰
高洛峰original
2016-12-29 16:21:161118parcourir

<table id="tb1" width="200" border="1" cellpadding="4" cellspacing="0">
    <tr>
        <td height="25">第一行</td>
    </tr>
    <tr>
        <td height="25">第二行</td>
    </tr>
    <tr>
        <td height="25">第三行</td>
    </tr>
    <tr>
        <td height="25">第四行</td>
    </tr>
         <tr>
        <td height="25"><input type="button" name="getTableContent" value="获得表格内容" onclick="getTableContent(this)"></td>
    </tr>
</table>

Comme le montre le code ci-dessus, l'objet this est passé dans l'événement de clic sur le bouton, et cet objet est le bouton lui-même. Utilisez la méthode suivante pour tester les données de la table

<script language="javascript">
    function getTableContent(node) {
// 按钮的父节点的父节点是tr。
          var tr1 = node.parentNode.parentNode;
            alert(tr1.rowIndex);
            alert(tr1.cells[0].childNodes[0].value); //获取的方法一
alert(tr1.cells[0].innerText); 
// 通过以下方式找到table对象,在获取tr,td。然后获取td的html内容
        var table = document.getElementById("tb1");//获取第一个表格
         
        var child = table.getElementsByTagName("tr")[rowIndex - 1];//获取行的第一个单元格
                 
        var text = child.firstChild.innerHTML;
        window.alert("表格第" + rowIndex + "的内容为: " + text);
    }
</script>

Ce ci-dessus est l'exemple simple d'obtention du contenu de chaque tr et td du nœud de table en js apporté par l'éditeur, j'espère que tout le monde le fera. prend en charge le site Web PHP chinois. ~

Pour des exemples plus simples d'obtention du contenu de chaque tr et td de nœuds de table en js, veuillez faire attention au site Web PHP chinois pour les articles connexes !


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn