JS简单获取并修改input文本框内容的方法示例


Posted in Javascript onApril 08, 2018

本文实例讲述了JS简单获取并修改input文本框内容的方法。分享给大家供大家参考,具体如下:

一 介绍

获取文本框并修改其内容可以使用getElementById()方法来实现。

getElementById()方法可以通过指定的id来获取HTML标记,并将其返回。

语法:

sElement=document.getElementById(id)

sElement:用来接收该方法返回的一个对象。

id:用来设置需要获取HTML标记的id值。

二 应用

获取文本框并修改其内容

在页面加载后的文本框中将会显示“初始文本内容”,当单击按钮后将会改变文本框中的内容。

三 代码

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3water.com 获取文本框并修改其内容</title>
</head>
<body>
<script language="javascript">
 <!--
 function c1()
 {
 var t=document.getElementById("txt");
 t.value="3water.com 修改文本内容"
 }
 -->
</script>
<input type="text" id="txt" value="初始文本内容" size="30"/>
<input type="button" value="更改文本内容" name="btn" onclick="c1();" />
</body>
</html>

四 运行结果

JS简单获取并修改input文本框内容的方法示例

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js数字输入框(包括最大值最小值限制和四舍五入)
Nov 24 Javascript
没有document.getElementByName方法
Aug 19 Javascript
再谈JavaScript线程
Jul 10 Javascript
JavaScript与java语言有什么不同
Sep 22 Javascript
JS中使用mailto实现将用户在网页中输入的内容传递到本地邮件客户端
Oct 08 Javascript
浅谈JavaScript正则表达式-非捕获性分组
Mar 08 Javascript
使用vue制作FullPage页面滚动效果
Aug 21 Javascript
AngularJS中controller控制器继承的使用方法
Nov 03 Javascript
深入剖析JavaScript instanceof 运算符
Jun 14 Javascript
微信小程序学习总结(一)项目创建与目录结构分析
Jun 04 Javascript
在JavaScript中查找字符串中最长单词的三种方法(推荐)
Jan 18 Javascript
Javascript webpack动态import
Apr 19 Javascript
详解vue表单——小白速看
Apr 08 #Javascript
JS简单实现动态添加HTML标记的方法示例
Apr 08 #Javascript
React Router v4 入坑指南(小结)
Apr 08 #Javascript
Angular 5.x 学习笔记之Router(路由)应用
Apr 08 #Javascript
vue2.0 资源文件assets和static的区别详解
Apr 08 #Javascript
通过vue-router懒加载解决首次加载时资源过多导致的速度缓慢问题
Apr 08 #Javascript
vuex 项目结构目录及一些简单配置介绍
Apr 08 #Javascript
You might like
收音机史话 - 1960年代前后的DIY
2021/03/02 无线电
关于拼配咖啡,你要知道
2021/03/03 咖啡文化
ninety plus是什么?ninety plus咖啡好吗?
2021/03/04 新手入门
php部分常见问题总结
2008/03/27 PHP
php中修改浏览器的User-Agent来伪装你的浏览器和操作系统
2011/07/29 PHP
php使用百度翻译api示例分享
2014/01/31 PHP
php多功能图片处理类分享(php图片缩放类)
2014/03/14 PHP
PHP判断远程图片是否存在的几种方法
2014/05/04 PHP
基于php判断客户端类型
2016/10/14 PHP
遍历echsop的region表形成缓存的程序实例代码
2016/11/01 PHP
用js实现下载远程文件并保存在本地的脚本
2008/05/06 Javascript
拖拉表格的JS函数
2008/11/20 Javascript
jQuery 处理网页内容的实现代码
2010/02/15 Javascript
javascript设计模式 封装和信息隐藏(上)
2012/07/24 Javascript
js实现简单的星级选择器提交效果适用于评论等
2013/10/18 Javascript
利用javascript数组长度循环数组内所有元素
2013/12/27 Javascript
判断输入的字符串是否是日期格式的简单方法
2016/07/11 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
微信小程序视图控件与bindtap之间的问题的解决
2019/04/08 Javascript
vue iview多张图片大图预览、缩放翻转
2019/07/13 Javascript
webpack4 配置 ssr 环境遇到“document is not defined”
2019/10/24 Javascript
node运行js获得输出的三种方式示例详解
2020/07/02 Javascript
Javascript call及apply应用场景及实例
2020/08/26 Javascript
jQuery实现手风琴特效
2021/01/11 jQuery
Python实现类的创建与使用方法示例
2017/07/25 Python
Python3中函数参数传递方式实例详解
2019/05/05 Python
python TF-IDF算法实现文本关键词提取
2019/05/29 Python
Python叠加两幅栅格图像的实现方法
2019/07/05 Python
python定间隔取点(np.linspace)的实现
2019/11/27 Python
python主要用于哪些方向
2020/07/05 Python
Html5新标签解释及用法
2012/02/17 HTML / CSS
专门经营化妆刷的美国彩妆品牌:Sigma Beauty
2017/09/11 全球购物
大学老师推荐信
2014/02/25 职场文书
二手房购房意向书范本
2014/04/01 职场文书
无刑事犯罪记录证明
2014/09/18 职场文书
Python中request的基本使用解决乱码问题
2022/04/12 Python