用javaScript获取页面元素值

Posted 2020-10-16 山水爱恋

用javascript获取页面元素常见的三种方法：

                                                          getElementById()

                                                          getElementsByName()

                                                          getElementsByTagName()

 

语法为“document.+方法名”获得其页面元素，可后加属性为其操作。

如document.getElementById("id名")是根据页面id获取元素，在一个页面中元素id必须是惟一 一个，否则用这种方法将取不到其元素。id就相当于我们个人的身份证号一样，在一个世界上，每个人都是唯一的身份证号。如果页面中没有此id，会找不到你要找的元素，就会报null的错误。

例如:var x=document.getElementById("id").value;

 用getElementsByName()用这种方法是跟据页面的元素名来获取页面元素，在一个页面中，元素id是唯一的，但是页面的元素名字name可以是重复的，name就比如我们人名一样，在这个世界中，会有重名的存在。假设一个两个名叫汤姆的人在一起，其他人过来找汤姆，就会直接找到两个，在页面中也是一样，中这种方法，我们会得到一个数组。如果我们找到某个具体的页面元素，可以在此方法后面添加一个下标"[整数]"，下标是从0开始的，此整数也就是在页面中你要获取的此元素的位置减一。

例如：var x = document.getElementsByName("ABCD").value;  //此时的x就是页面中所有name="ABCD"所形成的一个数组

         var x = document.getElementsByName("ABCD")[0].value;     //此时的x就是页面中第一个name=‘‘ABCD"的值

用 getElementsByTagName()这种方法是根据html的标签来获取的。因为页面元素使用的标签可以重复，所以用这种方法的的值也是一个数组。如果我们用这种方法想获取某个具体的元素的值，可以直接用下标的形式表示，下标的开始也是从0开始的，当然也可以先的到数组，在从数组中获取。

例如：var x = document.getElementsByTagName("p")[2].value;       //此时的x是页面中第三个段落标签的值

        var x = document.getElementsByTagName("p").value;       //此时的x是一个数组，是有页面中所有<p></p>所组成的一个数组