JavaScript动态修改网页元素内容的方法


Posted in Javascript onMarch 21, 2015

本文实例讲述了JavaScript动态修改网页元素内容的方法。分享给大家供大家参考。具体分析如下:

下面的JS代码当用户点击提交按钮后,通过元素的textContent或者innerHTML动态指定元素的内容

<script type="text/javascript">
function showCard() {
 var message = document.getElementById("CCN").value;
 var element = document.getElementById("mycreditcardnumber");
 element.textContent = message;
//for Firefox
 element.innerHTML = message;
//for IE (why can't we all just get along?)
 return true;
}
</script>
<form name="dynamic" method="get">
<span>Enter Your Credit Card Number:</span>
<input type="text" id="CCN" name="CCN" value="CCN" />
<input type="button" value="submit" onclick="showCard()" />
</form>
<p>Verify your Credit Card Number:
 <span id="mycreditcardnumber">0000-00-0000-00 </span>
</p>

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

Javascript 相关文章推荐
服务端 VBScript 与 JScript 几个相同特性的写法 By shawl.qiu
Mar 06 Javascript
JavaScript加密解密7种方法总结分析
Oct 07 Javascript
编写自己的jQuery插件简单实现代码
Apr 19 Javascript
javascript在myeclipse中报错的解决方法
Oct 29 Javascript
javascript得到当前页的来路即前一页地址的方法
Feb 18 Javascript
javascript面向对象之定义成员方法实例分析
Jan 13 Javascript
js实现索引图片切换效果
Nov 21 Javascript
原生JS改变透明度实现轮播效果
Mar 24 Javascript
vuejs如何配置less
Apr 25 Javascript
使用JavaScript开发跨平台的桌面应用详解
Jul 27 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
Sep 28 Javascript
Vue.js结合bootstrap前端实现分页和排序效果
Dec 29 Javascript
JavaScript实现向OL列表内动态添加LI元素的方法
Mar 21 #Javascript
JavaScript实现当网页加载完成后执行指定函数的方法
Mar 21 #Javascript
JavaScript动态加载样式表的方法
Mar 21 #Javascript
JavaScript获得url所有参数键值表的方法
Mar 21 #Javascript
JavaScript删除数组元素的方法
Mar 20 #Javascript
JavaScript通过join函数连接数组里所有元素的方法
Mar 20 #Javascript
JavaScript把数组作为堆栈使用的方法
Mar 20 #Javascript
You might like
一个php短网址的生成代码(仿微博短网址)
2014/05/07 PHP
php解决crontab定时任务不能写入文件问题的方法分析
2019/09/16 PHP
关于firefox的ElementTraversal 接口 使用说明
2010/11/11 Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
2012/09/14 Javascript
javascript 实现键盘上下左右功能的小例子
2013/09/15 Javascript
JavaScript省市联动实现代码
2014/02/15 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
谈谈jQuery Ajax用法详解
2015/11/27 Javascript
jquery实现定时自动轮播特效
2015/12/10 Javascript
从零开始学习Node.js系列教程四:多页面实现数学运算的client端和server端示例
2017/04/13 Javascript
基于JavaScript实现弹幕特效
2020/08/27 Javascript
vue语法之拼接字符串的示例代码
2017/10/25 Javascript
在vue项目中引用Iview的方法
2018/09/14 Javascript
countup.js实现数字动态叠加效果
2019/10/17 Javascript
js实现转动骰子模型
2019/10/24 Javascript
Vue实例的对象参数options的几个常用选项详解
2019/11/08 Javascript
解决removeEventListener 无法清除监听的问题
2020/10/30 Javascript
element中Steps步骤条和Tabs标签页关联的解决
2020/12/08 Javascript
[02:44]2014DOTA2 国际邀请赛中国区预选赛 大神红毯秀
2014/05/25 DOTA
[03:55]显微镜下的DOTA2特别篇——430灰烬之灵神级操作
2014/06/24 DOTA
[56:01]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 Effect vs EG
2018/03/31 DOTA
Python发送form-data请求及拼接form-data内容的方法
2016/03/05 Python
Python中的Django基本命令实例详解
2018/07/15 Python
解决python xx.py文件点击完之后一闪而过的问题
2019/06/24 Python
用Python配平化学方程式的方法
2019/07/20 Python
没编程基础可以学python吗
2020/06/17 Python
微软马来西亚官方网站:Microsoft马来西亚
2019/11/22 全球购物
党章培训心得体会
2014/09/04 职场文书
个人自查自纠材料
2014/10/14 职场文书
个人股份合作协议书
2014/10/24 职场文书
优秀党员事迹材料
2014/12/18 职场文书
公司门卫岗位职责
2015/04/13 职场文书
针对吵架老公保证书
2015/05/08 职场文书
采购员工作总结范文
2015/08/12 职场文书
七年级生物教学反思
2016/02/20 职场文书
python制作图形界面的2048游戏, 基于tkinter
2021/04/06 Python