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 相关文章推荐
jquery.simple.tree插件 更简单,兼容性更好的无限树插件
Sep 03 Javascript
jquery基础教程之deferred对象使用方法
Jan 22 Javascript
jQuery Mobile弹出窗、弹出层知识汇总
Jan 05 Javascript
Bootstrap被封装的弹层
Jul 20 Javascript
利用BootStrap弹出二级对话框的简单实现方法
Sep 21 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
Oct 25 Javascript
Node.js websocket使用socket.io库实现实时聊天室
Feb 20 Javascript
详解使用vue脚手架工具搭建vue-webpack项目
May 10 Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
Jul 19 Javascript
JavaScript观察者模式原理与用法实例详解
Mar 10 Javascript
Bootstrap简单实用的表单验证插件BootstrapValidator用法实例详解
Mar 29 Javascript
JavaScript事件的委托(代理)的用法示例详解
Feb 18 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
php同时使用session和cookie来保存用户登录信息的实现代码
2016/05/13 PHP
Laravel 错误提示本地化的实现
2019/10/22 PHP
JavaScript中双叹号!!作用示例介绍
2014/09/21 Javascript
谈谈javascript中使用连等赋值操作带来的问题
2015/11/26 Javascript
jQuery插件制作的实例教程
2016/05/16 Javascript
js判断文件格式及大小的简单实例(必看)
2016/10/11 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
2016/11/20 Javascript
Websocket协议详解及简单实例代码
2016/12/12 Javascript
JavaScript 事件对内存和性能的影响
2017/01/22 Javascript
vuex 动态注册方法 registerModule的实现
2019/07/03 Javascript
JS回调函数简单易懂的入门实例分析
2019/09/29 Javascript
微信小程序实现禁止分享代码实例
2019/10/19 Javascript
JS FormData对象使用方法实例详解
2020/02/12 Javascript
python获得linux下所有挂载点(mount points)的方法
2015/04/29 Python
Python抓取框架 Scrapy的架构
2016/08/12 Python
Ubuntu 下 vim 搭建python 环境 配置
2017/06/12 Python
Python2/3中urllib库的一些常见用法
2017/12/19 Python
Python cookbook(数据结构与算法)从字典中提取子集的方法示例
2018/03/22 Python
Python并发:多线程与多进程的详解
2019/01/24 Python
Python for循环及基础用法详解
2019/11/08 Python
python输出数组中指定元素的所有索引示例
2019/12/06 Python
python3 tcp的粘包现象和解决办法解析
2019/12/09 Python
如何使用python代码操作git代码
2020/02/29 Python
捷克电器和DJ设备网上商店:Electronic-star
2017/07/18 全球购物
美国睫毛、眉毛精华液领导品牌:RevitaLash Cosmetics
2018/03/26 全球购物
Pandora德国官网:购买潘多拉手链、戒指、项链和耳环
2020/02/20 全球购物
应届生财务会计求职信
2013/11/05 职场文书
大学毕业生最详细的自我评价分享
2013/11/18 职场文书
幼儿园教师请假制度
2014/01/16 职场文书
运动会广播稿500字
2014/01/28 职场文书
金融系毕业生自荐书
2014/07/08 职场文书
2014市府办领导班子“四风问题”对照检查材料思想汇报
2014/09/24 职场文书
《鲸》教学反思
2016/02/23 职场文书
销售会议开幕词
2016/03/04 职场文书
Python内置的数据类型及使用方法
2022/04/13 Python
Golang 字符串的常见操作
2022/04/19 Golang