浅谈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 相关文章推荐
js prototype 格式化数字 By shawl.qiu
Apr 02 Javascript
js保存当前路径(cookies记录)
Dec 14 Javascript
js从10种颜色中随机取色实现每次取出不同的颜色
Oct 23 Javascript
javascript打印html内容功能的方法示例
Nov 28 Javascript
Area 区域实现post提交数据的js写法
Apr 22 Javascript
jquery 扑捉回车键事件代码
Apr 24 Javascript
jQuery Validate初步体验(一)
Dec 12 Javascript
12 款 JS 代码测试必备工具(翻译)
Dec 13 Javascript
jQuery实现获取h1-h6标题元素值的方法
Mar 06 Javascript
vue中如何让子组件修改父组件数据
Jun 14 Javascript
使用vuex解决刷新页面state数据消失的问题记录
May 08 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 Javascript
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处理会话函数大总结
2015/08/05 PHP
PHP加密解密函数详解
2015/10/28 PHP
Yii2框架dropDownList下拉菜单用法实例分析
2016/07/18 PHP
extJs 下拉框联动实现代码
2010/04/09 Javascript
面向对象的Javascript之三(封装和信息隐藏)
2012/01/27 Javascript
javascript时间自动刷新实现原理与步骤
2013/01/06 Javascript
js关闭当前页面(窗口)的几种方式总结
2013/03/05 Javascript
Js获取图片原始宽高的实现代码
2016/05/17 Javascript
js中json处理总结之JSON.parse
2016/10/14 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
2017/02/22 Javascript
vue深入解析之render function code详解
2017/07/18 Javascript
JSONP原理及应用实例详解
2018/09/13 Javascript
使用koa-log4管理nodeJs日志笔记的使用方法
2018/11/30 NodeJs
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
Python对列表排序的方法实例分析
2015/05/16 Python
python dict 字典 以及 赋值 引用的一些实例(详解)
2017/01/20 Python
Python中装饰器学习总结
2018/02/10 Python
Pycharm取消py脚本中SQL识别的方法
2018/11/29 Python
Django框架自定义session处理操作示例
2019/05/27 Python
用Q-learning算法实现自动走迷宫机器人的方法示例
2019/06/03 Python
flask框架json数据的拿取和返回操作示例
2019/11/28 Python
TensorFlow2.0矩阵与向量的加减乘实例
2020/02/07 Python
Python实现AI自动抠图实例解析
2020/03/05 Python
Python virtualenv虚拟环境实现过程解析
2020/04/18 Python
Pytorch转keras的有效方法,以FlowNet为例讲解
2020/05/26 Python
公司企业表扬信
2014/01/11 职场文书
2014新年元旦活动策划方案
2014/02/18 职场文书
售后服务经理岗位职责
2014/02/25 职场文书
委托书范本
2014/04/02 职场文书
优秀班组事迹材料
2014/12/24 职场文书
结婚堵门保证书
2015/05/08 职场文书
详解Nginx 工作原理
2021/03/31 Servers
阿里云Nginx配置https实现域名访问项目(图文教程)
2021/03/31 Servers
quickjs 封装 JavaScript 沙箱详情
2021/11/02 Javascript
SpringBoot系列之MongoDB Aggregations用法详解
2022/02/12 MongoDB
Golang map映射的用法
2022/04/22 Golang