浅谈javascript中createElement事件


Posted in Javascript onDecember 05, 2014

createElement是HTML中应用W3C DOM对像模型建立子节点也就是子元素的概念

 <script>

   window.onload = function () {

   var input  = document.createElement('input');

   var button = document.createElement('input');

   input.type ='text';  

   input.id= 'text';

   input.value ='1';

   button.type='button';

   button.value ='逐加';

   button.style.width = '40px';

   button.style.height = '23px';

   document.body.appendChild(input);

   document.body.appendChild(button);

   button.onclick = function(){

      var value = input.value;

      input.value = value * 1 + 1;

   }

  }

 </script>

 注:value其实是一个字符,如果将input.value=value*1+1;换成input.value=value+1;则结果会出现111111,他是不断以字符形式加1的,所以这时候value*1的就能将value值转换成Int型了。

总结:

要最终解决 createElement 方法的兼容性问题,还是要注意判断浏览器,针对 IE 可以使用其特有的通过为createElement 传入一段合法的 HTML 代码字符串作为参数的方法,非 IE 浏览器仍然使用 W3C 规范的标准方法。

Javascript 相关文章推荐
常见效果实现之返回顶部(结合淡入、淡出、减速滚动)
Jan 04 Javascript
javascript中不等于的代码是什么怎么写
Dec 29 Javascript
js清空form表单中的内容示例
May 20 Javascript
对js eval()函数的一些见解
Aug 15 Javascript
Angular2 多级注入器详解及实例
Oct 30 Javascript
JavaScript交换两个变量值的七种解决方案
Dec 01 Javascript
JS实现点击复选框变更DIV显示状态的示例代码
Dec 18 Javascript
微信小程序将字符串生成二维码图片的操作方法
Jul 17 Javascript
vue动画效果实现方法示例
Mar 18 Javascript
vue学习笔记之作用域插槽实例分析
Feb 01 Javascript
js实现简单的无缝轮播效果
Sep 05 Javascript
jQuery实现计算器功能
Oct 19 jQuery
javascript的push使用指南
Dec 05 #Javascript
javascript结合ajax读取txt文件内容
Dec 05 #Javascript
javascript实现切换td中的值
Dec 05 #Javascript
使用Javascript简单实现图片无缝滚动
Dec 05 #Javascript
深入分析js的冒泡事件
Dec 05 #Javascript
Javascript解析URL方法详解
Dec 05 #Javascript
jQuery不兼容input的change事件问题解决过程
Dec 05 #Javascript
You might like
PHP使用CURL模拟登录的方法
2015/07/08 PHP
PHP数组实例详解
2016/06/26 PHP
Laravel搭建后台登录系统步骤详解
2016/07/26 PHP
浅谈PHP定义命令空间的几个注意点(推荐)
2016/10/29 PHP
JavaScript Prototype对象
2009/01/07 Javascript
处理及遍历XML文档DOM元素属性及方法整理
2013/08/23 Javascript
JS保留两位小数,多位小数的示例代码
2014/01/07 Javascript
使用GruntJS构建Web程序之构建篇
2014/06/04 Javascript
ajax+jQuery实现级联显示地址的方法
2015/05/06 Javascript
JavaScript简单生成 N~M 之间随机数的方法
2017/01/13 Javascript
jQuery DateTimePicker 日期和时间插件示例
2017/01/22 Javascript
AngularJS遍历获取数组元素的方法示例
2017/11/11 Javascript
深入理解Angular4订阅(Subscribe)与取消
2017/11/22 Javascript
微信小程序如何使用globalData的方法
2019/06/06 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
[03:32]2014DOTA2西雅图邀请赛 CIS外卡赛赛前black专访
2014/07/09 DOTA
python让列表倒序输出的实例
2018/06/25 Python
详解配置Django的Celery异步之路踩坑
2018/11/25 Python
学习python分支结构
2019/05/17 Python
python Pandas如何对数据集随机抽样
2019/07/29 Python
Window10下python3.7 安装与卸载教程图解
2019/09/30 Python
关于python pycharm中输出的内容不全的解决办法
2020/01/10 Python
python字符串下标与切片及使用方法
2020/02/13 Python
Tensorflow与Keras自适应使用显存方式
2020/06/22 Python
python使用建议技巧分享(三)
2020/08/18 Python
python爬虫中PhantomJS加载页面的实例方法
2020/11/12 Python
HTML5 Canvas中绘制椭圆的4种方法
2015/04/24 HTML / CSS
HTML5 常见面试题之PC端和移动端区别介绍
2018/01/22 HTML / CSS
护士辞职信模板
2014/01/20 职场文书
应届毕业生个人求职信范文
2014/01/29 职场文书
爱国主义演讲稿
2014/05/07 职场文书
企业文化理念标语
2014/06/10 职场文书
五好家庭申报材料
2014/12/20 职场文书
优秀班组申报材料
2014/12/25 职场文书
python开发实时可视化仪表盘的示例
2021/05/07 Python
Win2008系统搭建DHCP服务器
2022/06/25 Servers