用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>所组成的一个数组

用javaScript获取页面元素值的更多相关文章

  1. JavaScript获取页面元素的常用方法

    1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 ...

  2. 用Javascript获取页面元素的位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  3. Javascript获取页面元素相对和绝对位置

    制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...

  4. JavaScript 获取页面元素

    一.根据 id 获取元素 语法格式: document.getElementById(id); Demo: var main = document.getElementById('main'); co ...

  5. JS与JQ 获取页面元素值的方法和差异对比

    获取浏览器高度和宽度 document.documentElement.clientWidth ==> 浏览器可见区域宽度 document.documentElement.clientHeig ...

  6. JavaScript获取页面元素方法

  7. JavaScript DOM编程基础精华01(DOM入门,DOM模型和获取页面元素,事件,window对象的方法)

    DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...

  8. JS获取页面,元素,窗口和返回页面,元素,窗口的宽高以及滚动值

    jquery获取页面,元素,窗口的宽高以及滚动值 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window) ...

  9. js获取页面元素距离浏览器工作区顶端的距离

    先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome)  网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript)       ...

随机推荐

  1. poj 3304

    我老人家要开始玩几何了! .这个题有点自闭. 就是问是否存在一条直线经过所有了n条线段,(有交点). 我老人家愚昧不可救药,想了想决定先求出来 这两条直线的交点,然后看是否在线段上.但是一直写不对.. ...

  2. route 配置默认网关

    影响Linux系统网络中网关配置信息的3种方式 1.生效文件cat /etc/sysconfig/network-scripts/ifcfg-eth0 GATEWAY=10.0.0.254 <- ...

  3. python全栈开发 * 08知识点汇总 * 180608

    08知识点梳理 文件操作一 .文件操作 r (只读)1.r (读) rb(字节)f=open("果蔬大杂烩",mode="r",encoding="U ...

  4. python----下载与安装

    在 Windows 上安装 Python 在 Windows 上安装 Python 请按如下步骤进行. 首先,登录 https://www.python.org/downloads/ 页面,可以在该页 ...

  5. 201621123049《java程序设计》第四周学习总结

    1. 本周学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 继承 类型转换 覆盖 1.2 尝试使用思维导图将这些关键词组织起来.注:思维导图一般不需要出现过多的字. 2. 书面作业 1. ...

  6. 我了解到的新知识之---Cylance Protect是干吗的?

    每家企业都会采购适合自己的杀毒软件来保护企业内的电脑处在安全的状态下,我所在的公司目前在用的是来自美国的初创企业的产品Cylance Protect.,目前这家公司已经在2018年11月份被黑莓公司收 ...

  7. [No0000193]Chrome浏览器控制台(console)花式调试

    对前端开发者来说,Chrome Dev Tools(开发者工具,以下简称CDT)是一个不可或缺的开发调试工具,但是你可能只用过console.log(),却不知道console还有很多功能强大的调试方 ...

  8. CFGym101138D Strange Queries 莫队/分块

    正解:莫队/分块 解题报告: 传送门 ummm这题耗了我一天差不多然后我到现在还没做完:D 而同机房的大佬用了一个小时没有就切了?大概这就是大佬和弱鸡的差距趴QAQ 然后只是大概写下思想好了因为代码我 ...

  9. http 你造吗?

    HTTP是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统.它于1990年提出,经过几年的使用与发展,得到不断地完善和扩展.目前在WWW中使用的是HTTP/1.0的第 ...

  10. git忽略规则.gitignore未生效解决办法

    创建git本地的仓库常用命令:git init #初始化--------生成.git文件 配置本地用户名跟邮箱(这样就知道是谁提交的东西)git config --global user.name [ ...