博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
通过js获得input文本框输入的值
阅读量:3900 次
发布时间:2019-05-23

本文共 1486 字,大约阅读时间需要 4 分钟。

如何通过js获得input文本框输入的值。

  • 前言

我们编写的被载入浏览器的HTML页面都是一个 Document 对象。对于Document对象可以使我们通过代码(比如javascript)对HTML页面中的所有元素进行访问。比如div标签元素、span元素、input元素等等。

Document对象具有以下的属性:

Body:提供对 <body> 元素的直接访问。对于定义了框架集的文档,该属性引用最外层的 <frameset>。

: 设置或返回与当前文档有关的所有 cookie。

:返回当前文档的域名

:返回文档被最后修改的日期和时间。

:返回载入当前文档的文档的 URL。

:返回当前文档的标题。

: 返回当前文档的 URL。

Document 对象的方法:

:打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。

:关闭用 document.open() 方法打开的输出流,并显示选定的数据。

:返回对拥有指定 id 的第一个对象的引用。

:返回带有指定名称的对象集合。

:返回带有指定标签名的对象集合。

:向文档写 HTML 表达式 或 JavaScript 代码。

:等同于 write() 方法,不同的是在每个表达式之后写一个换行符。

二.实例

通过上述的document对象及其方法我们可以采用js获取input文本框输入的内容,在html中input也是元素内容,代码如下

通过id以及document对象的方法,我们可以获取其值代码如下

function selectValue() {        //声明value变量并将获取的值赋给value        var value = document.getElementById("inputValueID").value;        //窗口弹出input文本框输入的值        alert(value);    }

结果如下

同样,还可以通过getElementsByName方法和getElementsByTagName方法获取值。

getElementsByName():

function selectValue() {        //声明value变量并将获取的值赋给value        var value = document.getElementByName("inputValueID").value;        //窗口弹出input文本框输入的值        alert(value);    }

    getElementsByTagName():

function selectValue() {        //声明value变量并将获取的值赋给value        var value = document.getElementByName("input").value;//如果是p标签则是,        var value = document.getElementByName("P").value;//如果传递的是*,返回所有元素的列表,元素排列的顺序就是它们在html中的顺序。        var value = document.getElementByName("*");        //窗口弹出input文本框输入的值        alert(value);    }

申明:以上关于document介绍部分内容参考,如有侵权,联系作者删除。

转载地址:http://ehcen.baihongyu.com/

你可能感兴趣的文章
js实现上传图片前预览效果
查看>>
spring 缓存@Cacheable的用法以及配置
查看>>
spring 后台对象为空校验@Valid的用法以及配置。以及@Valid抛出异常问题分析
查看>>
java isAssignableFrom,isInstance,AnnotationUtils.findAnnotation用法讲解
查看>>
js 正则表达式分数校验小于等于100,并且保留一位小数
查看>>
Wdatepicker限制日期用法(开始日期不大于结束日期,并且不大于当前日期)
查看>>
oracle 根据逗号拼接的数据进行查询,进行一一对应
查看>>
cmd 批量编译某个路径下的java文件
查看>>
nginx配置查看服务器日志目录文件
查看>>
tomcat性能优化配置-协议类型选择nio或APR
查看>>
用jquery实现简单的模块开发
查看>>
spring-data-redis 整合配置redis
查看>>
解决Could not resolve placeholder 'redis.maxTotal' in string value "${redis.maxTotal}
查看>>
redis+lua实现高并发商品秒杀案例
查看>>
arttemplate基础语法介绍
查看>>
FreeMarker基础语法介绍
查看>>
linux 下安装minio并配置
查看>>
js 验证身份证合法性以及真实性18位和15位
查看>>
js 图片上传进行FileReader解析展示
查看>>
tomcat配置war包路径启动
查看>>