用javaScript获取页面元素值
用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获取页面元素值的更多相关文章
- JavaScript获取页面元素的常用方法
1.通过标签获取元素,返回一个数组 var li = document.getElementsByTagName('li');//标签获取元素 li[0].innerHTML;// 查看获取元素的内容 ...
- 用Javascript获取页面元素的位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...
- Javascript获取页面元素相对和绝对位置
制作网页的过程中,你有时候需要知道某个元素在网页上的确切位置. 下面的教程总结了Javascript在网页定位方面的相关知识. 一.网页的大小和浏览器窗口的大小 首先,要明确两个基本概念. 一张网页的 ...
- JavaScript 获取页面元素
一.根据 id 获取元素 语法格式: document.getElementById(id); Demo: var main = document.getElementById('main'); co ...
- JS与JQ 获取页面元素值的方法和差异对比
获取浏览器高度和宽度 document.documentElement.clientWidth ==> 浏览器可见区域宽度 document.documentElement.clientHeig ...
- JavaScript获取页面元素方法
- JavaScript DOM编程基础精华01(DOM入门,DOM模型和获取页面元素,事件,window对象的方法)
DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...
- JS获取页面,元素,窗口和返回页面,元素,窗口的宽高以及滚动值
jquery获取页面,元素,窗口的宽高以及滚动值 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window) ...
- js获取页面元素距离浏览器工作区顶端的距离
先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome) 网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript) ...
随机推荐
- go与c语言的互操作
https://tonybai.com/2012/09/26/interoperability-between-go-and-c/ https://tonybai.com/2016/02/21/som ...
- Nginx 反向代理获取设备真实的IP地址
package com.das.common.util; import org.apache.commons.lang3.StringUtils; import org.springframework ...
- c++ 模板相关
https://blog.csdn.net/lezardfu/article/details/60466161 https://www.cnblogs.com/ymy124/p/3632634.htm ...
- 简单工厂模式(Java与Kotlin版)
Kotlin基础知识的学习,请参考之前的文章: Kotlin入门第一课:从对比Java开始 Kotlin入门第二课:集合操作 Kotlin入门第三课:数据类型 初次尝试用Kotlin实现Android ...
- thymeleaf(二)
项目demo http://pan.baidu.com/s/1wg6PC 学习资料网址 http://www.blogjava.net/bjwulin/archive/2013/02/07/ ...
- ASP.NET Core ResponseCaching:基于 VaryByHeader 定制缓存 Key
ASP.NET Core ResponseCaching 提供了缓存http响应内容的能力,通过它可以在本地内存中直接缓存http响应内容,这是速度最快的服务端缓存,省却了网络传输与生成响应内容的开销 ...
- POJ 3078 - Shuffle'm Up - [模拟题]
题目链接:http://poj.org/problem?id=3087 Description A common pastime for poker players at a poker table ...
- MySQL常用运算符:算术运算符、比较运算符、逻辑运算符
(一) 算术运算符 注意: 在除法运算和模运算中,如果除数为0,将是非法除数,返回结果为NULL. div运算符主要是求两个数相除的商 (二) 比较运算符:比较运算符的运算结果为1(条件为真),0 ...
- PrimeNG之FileUpload
--文件上传是一个支持拖放,多文件上传,自动上传,进度跟踪和验证的上传. Import import {FileUploadModule} from 'primeng/primeng'; Gettin ...
- Node项目的Restful化
提倡Restful风格的目的或者作用主要是,结构清晰.符合标准.易于理解.扩展方便. 个人把Restful简单粗暴地理解为:路由不包含动词. 怎么做到路由不包含动词呢?答案是,启用常用的GET和POS ...