在JavaScript中获取input元素value的值：

方法一：

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <meta http-equiv="X-UA-Compatible" content="IE=edge">

     <title>JavaScript中获取input元素value值</title>

     <link rel="stylesheet" href="">

     <script>

         function printInputValue() {

             var inputValue = document.getElementById("demo1").value;

             console.log(inputValue);

             document.getElementById("demo2").innerHTML = inputValue;

         }

     </script>

 </head>

 <body>

     <input type="text" id="demo1">

     <button onclick="printInputValue()">获取input元素value值</button>

     <p id="demo2"></p>

 </body>

 </html>

方法二：

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <meta http-equiv="X-UA-Compatible" content="IE=edge">

     <title>JavaScript34</title>

     <link rel="stylesheet" href="">

     <script>

         function print(){

             var a = myform.name.value;

             alert(a);

             document.getElementsByName("span")[0].innerHTML = a;

         }

     </script>

 </head>

 <body>

     <form name="myform">

         <input type="text" name="name" id="nn">

         <input type="button" name="button" value="测试" onclick="print()">

         <span name="span"></span>

     </form>

 </body>

 </html>

JavaScript如何获得input元素value的值的更多相关文章

  1. JavaScript如何获得input元素value值

    转载地址:http://aquarius-zf.iteye.com/blog/605144 在页面中我们最常见的页面元素就是input了,但是我们如何用JavaScript得到网页input中输入的v ...

  2. 【HTML5】input元素type属性值

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  3. (转)日期类型的input元素设置默认值为当天

    原文地址 html5的form元素对日期时间有丰富的支持 <input type="date"> <input type="time"> ...

  4. 日期类型的input元素设置默认值为当天

    html文件:<input name="" type="date" value="" id="datePicker" ...

  5. 笔记：HTML5中input元素新增的type值

    在HTML5中,input元素的type值增加了不少,使input的功能强大了很多. 但在各大浏览器中并不是所有的type值都支持. 以下是比较有用.并且浏览器支持的稍好一些的值: type=colo ...

  6. 定制input元素

    定制input元素 input元素可以用来生成一个供用户输入数据的简单文本框.其缺点在于用户在其中输入什么值都可以.有时这还不错,但是有时设计者可能希望让用户输入特定类型的数据.在后一种情况下,可以对 ...

  7. HTML5 input元素新的特性

    在HTML5中,<input>元素增加了许多新的属性.方法及控件.本文章分别对这三方面进行介绍. 目录 1. 属性 2. 方法 3. 新控件 1. 属性 <input>元素在H ...

  8. HTML中使用javascript解除禁止input输入框代码：

    转:表单中Readonly和Disabled的区别 参考资料: disabled和readonly区别: 参考博文1地址:http://blog.csdn.net/symgdwyh/article/d ...

  9. 了解HTML表单之input元素的23种type类型

    目录 传统类型 text password file radio checkbox hidden button image reset submit 新增类型 color tel email url ...

随机推荐

  1. Linux命令应用大词典-第32章 性能监控

    32.1 sar:收集.报告或保存系统活动信息 32.2 iostat:报告CPU统计数据和设备.分区输入.输出消息 32.3 iotop:进行I/O监控 32.4 mpstat:报告CPU相关的统计 ...

  2. 利用爬虫、SMTP和树莓派3B发送邮件&续集&(爬取墨迹天气预报信息)

    -----------------------------------------------学无止境----------------------------------------------- 前 ...

  3. 407. Plus One【LintCode java】

    Description Given a non-negative number represented as an array of digits, plus one to the number. T ...

  4. 下拉网页div自动浮在顶部

    <!DOCTYPE html> <html> <head> <title></title> <style type="tex ...

  5. Redis4.0支持的新功能说明

    本文以华为云DCS for Redis版本为例,介绍Redis4.0的新功能.文章转载自华为云帮助中心. 与Redis3.x版本相比,DCS的Redis4.x以上版本,除了开源Redis增加的特性之外 ...

  6. [C++] in-class initializer

    C++11 introduced serveral contructor-related enhancements including: Class member initializers Deleg ...

  7. selenium实现文件上传方法汇总（AutoIt、win32GUI、sengkeys）---基于python

    在使用selenium进行UI自动化测试时,经常会遇到一个关于本地文件上传的问题,解决此问题一般分两种情况: 1. 元素标签为input 2.非input型上传 下面我们分别对着两种情况进行实例分析 ...

  8. BZOJ 3790 神奇项链 hash/后缀自动机+贪心

    Description 母亲节就要到了,小 H 准备送给她一个特殊的项链.这个项链可以看作一个用小写字母组成的字符串,每个小写字母表示一种颜色. 为了制作这个项链,小 H 购买了两个机器.第一个机器可 ...

  9. 关于localStorage的实际应用

    在客户端存储数据 HTML5 提供了两种在客户端存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前, ...

  10. Java中I/O流之Object流

    Java 中的 object 流:直接将 Object 对象写入或读出 1. serializable 接口:序列化,可以被序列化的,若确实需要将某个类的对象写在硬盘上或网络上,想把他们序列化成一个字 ...