国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

javascript - Une question d'exercice JS, pourquoi le dernier getElementsByTagName('a')[0] ici est 0
女神的閨蜜愛上我
女神的閨蜜愛上我 2017-06-26 10:57:27
0
4
950
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>
        window.onload=function()
        {
            var oTab = document.getElementById('tab1');
            var oName = document.getElementById('name');
            var oAge = document.getElementById('age');
            var oBtn = document.getElementById('btn');
            var id =  oTab.rows.length+1;
            oBtn.onclick=function()
            {
                var oTr = document.createElement('tr');
                var oTd = document.createElement('td');
                oTd.innerHTML = id++;
                oTr.appendChild(oTd);

                var oTd = document.createElement('td');
                oTd.innerHTML =oName.value;
                oTr.appendChild(oTd);


                var oTd = document.createElement('td');
                oTd.innerHTML = oAge.value ;
                oTr.appendChild(oTd);


                var oTd = document.createElement('td');
                oTd.innerHTML = "<a href='javascript:'>刪除</a>" ;
                oTr.appendChild(oTd);

                oTd.getElementsByTagName('a')[0].onclick=function()
                {
                    oTab.tBodies[0].removeChild(this.parentNode.parentNode);
                }
                

                oTab.tBodies[0].appendChild(oTr);


            }
        }
        
    </script>
</head>
<body>
    姓名:<input id="name" type="text" />
    班級:<input id="age" type="text" />
    <input id="btn" type="button" value='添加' />
    <table id="tab1" border="1px" width="600px">
        <tHead>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>操作</td>
        </tHead>
        <tbody>
            <tr>
                <td>2</td>
                <td>22</td>
                <td>33</td>
                <td></td>
            </tr>
            <tr>
                <td>3</td>
                <td>22</td>
                <td>33</td>
                <td></td>
            </tr>
            <tr>
                <td>4</td>
                <td>22</td>
                <td>33</td>
                <td></td>
            </tr>
        </tbody>
    </table>
</body>
</html>

L'effet de cette implémentation est l'effet de l'ajout et de la suppression de la dernière colonne d'un tableau. Je ne comprends pas pourquoi oTd.getElementsByTagName('a')[0].onclick=function() fait cela après que createElement ait créé le a. fonction d'ajout et de suppression de balise. Le TagName sélectionné est [0]. Une balise a n'est-elle pas créée à chaque fois pour déclencher js?? Pourquoi ne pas créer une boucle for pour ajouter onclick à chaque a

女神的閨蜜愛上我
女神的閨蜜愛上我

répondre à tous(4)
typecho

迷茫

Il s'agit d'un cours MOOC JS en ligne. 'oTd' est à l'origine un élément créé après oBtn.onclick. Bien s?r, l'élément a est également nouvellement créé
Pourquoi utilisez-vous toujours [0] Parce que getElementsTagName(. 'a ') renvoie une liste d'éléments. Même si la longueur n'est que de 1, vous devez toujours utiliser [0] ou .item(0) pour obtenir cet élément DOM

代言

Il ressort de votre code que l'oTd à ce moment est utilisé pour stocker l'élément td du lien de suppression. Après avoir défini l'attribut innerHTML, l'élément td à ce moment est
<td><a. href='javascript:' >Delete</a></td>; <td><a href='javascript:'>刪除</a></td>
oTd.getElementsByTagName('a')的返回值是該td元素(限定了選擇范圍,就是從包含這個a元素的父元素td中選擇,而不是table元素)中包含的a元素組成的數(shù)組,因為該td元素只包含一個a元素,所以結(jié)果是長度為1的數(shù)組,要獲取這個a元素,當(dāng)然是取結(jié)果的[0]oTd.getElementsByTagName('a')La valeur de retour est l'élément td (plage de sélection limitée , c'est-à-dire de Sélectionnez le tableau des éléments a contenus dans l'élément parent td de cet élément a au lieu de l'élément table). étant donné que l'élément td ne contient qu'un seul élément a, le résultat est un tableau d'une longueur de 1. To obtenez ceci un élément, bien s?r. Le résultat est [0] (l'indice du tableau commence à 0) ;

Vous pouvez utiliser une boucle for pour ajouter des événements onclick. Vous pouvez utiliser

après chaque exécution de l'instruction oTab.tBodies[0].appendChild(oTr);.

var aArray = oTab.getElementsByTagName("a");
for (var i = 0; i < aArray.length; i++) {
    aArray[i].onclick = function() {
        oTab.tBodies[0].removeChild(this.parentNode.parentNode);
    }
}
Mais le problème est que lorsque vous cliquez sur Ajouter pour la première fois, un événement de clic est enregistré pour l'élément de la première information ajoutée lorsque vous cliquez sur Ajouter pour la deuxième fois, car la première information a déjà un élément d'information ajouté. événement de clic, pourquoi devons-nous écraser à nouveau l'événement de clic?? Il vous suffit d'enregistrer l'événement click pour l'élément nouvellement ajouté.

小葫蘆

Les éléments d'élément créés dynamiquement ne peuvent pas être liés à des événements de clic. Vous devez les utiliser ou les lier.

Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal