Heim > Web-Frontend > js-Tutorial > Hauptteil

So greifen Sie über getElementsByName in js auf das Namenssammlungsobjekt zu

高洛峰
Freigeben: 2016-12-08 13:24:50
Original
1638 Leute haben es durchsucht

1. Alle Elemente mit einem bestimmten Namensattribut finden. Diese Methode gibt eine Knotensammlung zurück, die auch als Objektsammlung bezeichnet werden kann.

2. Diese Sammlung kann als Array behandelt werden und der Wert des Längenattributs stellt die Anzahl der Sammlungen dar.

3. Da der Name ein Element in einer HTML-Seite nicht eindeutig bestimmen kann, lautet der Name der Methode getElementsByName anstelle von getElementByName

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
 
<body>
    <p>
        <input type="text" name="luck" value="我中奖了,中了一个亿" onclick="aa()" id="luck1" />
    </p>
    <p>
        <input type="text" name="luck" value="我交了女朋友" id="luck2" />
    </p>
    <p>
        <input type="text" name="luck" value="我升迁了" id="luck3" />
    </p>
    <p>
        <input type="text" name="luck" value="我买房了" id="luck4" />
    </p>
     
    <script>
        /*
        1、获取每一个文本框的值
        2、获取每一个文本框的类型
        3、为每一个文本框增加点击事件
        */
         
        /*
            第一步 获取name属性为luck值得对象数组(节点数组)
        */
        var luckElements = document.getElementsByName("luck");
         
        /*
            第二步 遍历节点数组
        */
        for(var i=0;i<luckElements.length;i++){
            //获取元素的value值
            alert(luckElements[i].value);
            //获取元素的type值
            alert(luckElements[i].type);
            //为每一个元素的onclick属性赋值即为文本框增加点击事件
            luckElements[i].onclick=function(){
                alert(this.value);
            }
        }
    </script>
</body>
</html>
Nach dem Login kopieren

3. Da der Name auf der HTML-Seite ein Element nicht eindeutig bestimmen kann, lautet der Name der Methode getElementsByName anstelle von getElementByName


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!