JavaScript获得input元素value值的方法

 更新时间:2023年10月09日 14:40:00   作者:zeroone001  
在页面中我们最常见的页面元素就是input了,但是我们如何用JavaScript得到网页input中输入的value值呢,其实很简单,方法也不止一种,今天给大家分享两种JavaScript获得input元素value值的方法,感兴趣的朋友跟随小编一起看看吧

在页面中我们最常见的页面元素就是input了,但是我们如何用JavaScript得到网页input中输入的value值呢,其实很简单,方法也不止一种,据我总结比较常用的就是下面的两种方法,闲话不多说了,下面那就来看看我说的方法吧: 

方法一、 

<html>  
 <head>  
 <script language="javascript">  
  function print(){  
   var a=myform.name.value;  
   alert(a);  
  }  
 </script>  
 </head>  
 <body>  
  <form name="myform">  
   <input type="text" name="name" id="nn" />  
   <input type="button" name="button" value="获取" onclick="print()" />  
  </form>    
 </body>  
</html>  

这是获取网页input值的方法之一,给from一个名字然后在JavaScript的地方就可以用form的名字来调用form表单里input元素的value属性可以得到值,并把值赋给a,最后用JavaScript的alert()打印方法打印出来。 

方法二、 

JS代码  

<html>  
 <head>  
 <script language="javascript">  
  function print(){  
   var a=document.getElementById("nn").value;  
   alert(a);  
  }  
 </script>  
 </head>  
 <body>  
  <form>  
   <input type="text" name="name" id="nn" />  
   <input type="button" name="button" value="获取" onclick="print()" />  
  </form>    
 </body>  
</html>  

到此这篇关于JavaScript获得input元素value值的方法的文章就介绍到这了,更多相关js获取input元素value值内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JavaScript中的class类详解

    JavaScript中的class类详解

    JavaScript 中的类(Class)是一种新的语言特性,它让我们可以使用面向对象编程的思想来更加方便地组织和管理代码。在本文中,我们将详细介绍 JavaScript 中的类特性,感兴趣的同学可以借鉴阅读
    2023-05-05
  • js仿百度切换皮肤功能(html+css)

    js仿百度切换皮肤功能(html+css)

    这篇文章主要为大家详细介绍了JavaScript仿百度切换皮肤功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-07-07
  • Javascript生成带参数的二维码示例

    Javascript生成带参数的二维码示例

    这篇文章主要给大家介绍了Javascript生成带有参树二维码的方法,实现的方法还是很简单的,有需要的朋友们可以参考借鉴。下面来一起看看吧。
    2016-10-10
  • 使用sql.js在前端项目中接入SQLite数据库

    使用sql.js在前端项目中接入SQLite数据库

    sql.js为前端开发者提供了一种强大的工具,可以在浏览器环境中使用SQLite的完整功能,本文介绍了如何在前端项目中接入sql.js,执行基本的SQL操作,实现数据持久化,以及在React项目中的应用示例,同时,我们也讨论了性能优化、最佳实践以及sql.js的适用场景和限制
    2025-05-05
  • js is_valid_filename验证文件名的函数

    js is_valid_filename验证文件名的函数

    有时候我们需要对文件名进行控制,包括一些特殊命名的文件与特殊符号的文件名进程替换,那么就可以使用下面的函数
    2017-07-07
  • 为网站代码块pre标签增加一个复制代码按钮代码

    为网站代码块pre标签增加一个复制代码按钮代码

    写文章的时候,作为一名专业的码农,经常会在文章中粘贴一些代码。有的时候代码块比较长,在后期使用中需要复制这段代码就比较麻烦
    2021-11-11
  • JavaScript命名空间模式实例详解

    JavaScript命名空间模式实例详解

    这篇文章主要介绍了JavaScript命名空间模式,结合实例形式分析了javascript命名空间模式的相关概念、原理、实现方法及操作注意事项,需要的朋友可以参考下
    2019-06-06
  • 深入浅出JavaScript中base64编码原理

    深入浅出JavaScript中base64编码原理

    今天翻开旧项目发现挺多图片相关的插件都是用 base64 来显示图片的。谈到 base64,脑海遐想翩翩,思绪回荡之下 base64 瑕瑜互见。这篇文章主要是记录了工作中遇见的问题并加以总结,如有不妥请指正
    2023-02-02
  • JavaScript实现获取URL中参数值的4种方法

    JavaScript实现获取URL中参数值的4种方法

    这篇文章主要为大家详细介绍了如何使用JavaScript实现获取URL中参数值的4种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下
    2025-02-02
  • 如何提高javascript加载速度

    如何提高javascript加载速度

    本文主要对提高javascript加载速度的方法进行介绍,具有很好的参考价值,需要的朋友一起来看下吧
    2016-12-12

最新评论