浅谈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 相关文章推荐
javascript简易缓动插件(源码打包)
Feb 16 Javascript
Js动态添加复选框Checkbox的实例方法
Apr 08 Javascript
ajaxFileUpload.js插件支持多文件上传的方法
Sep 02 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
Oct 11 Javascript
JS匿名函数类生成方式实例分析
Nov 26 Javascript
laydate.js日期时间选择插件
Jan 04 Javascript
Javascript 一些需要注意的细节(必看篇)
Jul 08 Javascript
微信小程序表单验证form提交错误提示效果
Jun 19 Javascript
ECharts地图绘制和钻取简易接口详解
Jul 12 Javascript
前端使用crypto.js进行加密的函数代码
Aug 16 Javascript
vite2.0+vue3移动端项目实战详解
Mar 03 Vue.js
教你一步步实现一个简易promise
Nov 02 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制作简单的内容采集器的代码
2007/11/28 PHP
PHP 使用pcntl和libevent 实现Timer功能
2013/10/27 PHP
PHP SPL标准库中的常用函数介绍
2015/05/11 PHP
使用Zttp简化Guzzle 调用
2017/07/02 PHP
Yii2 中实现单点登录的方法
2018/03/09 PHP
在视频前插入广告
2006/11/20 Javascript
一个简单的javascript类定义例子
2009/09/12 Javascript
基于jquery的分页控件(C#)
2011/01/06 Javascript
js的alert样式如何更改如背景颜色
2014/01/22 Javascript
jQuery中remove()方法用法实例
2014/12/25 Javascript
js简单实现竖向tab选项卡的方法
2015/05/04 Javascript
理解JavaScript原型链
2016/10/25 Javascript
利用jQuery.Validate异步验证用户名是否存在(推荐)
2016/12/09 Javascript
react-native 完整实现登录功能的示例代码
2017/09/11 Javascript
Webpack框架核心概念(知识点整理)
2017/12/22 Javascript
详解layui弹窗父子窗口之间传参数的方法
2018/01/16 Javascript
详解Vue源码学习之双向绑定
2019/04/10 Javascript
vue实现的上拉加载更多数据/分页功能示例
2019/05/25 Javascript
vue 动态表单开发方法案例详解
2019/12/02 Javascript
微信小程序如何实现精确的日期时间选择器
2020/01/21 Javascript
three.js中多线程的使用及性能测试详解
2021/01/07 Javascript
使用Python下载Bing图片(代码)
2013/11/07 Python
python连接oracle数据库实例
2014/10/17 Python
利用numpy+matplotlib绘图的基本操作教程
2017/05/03 Python
在Python 2.7即将停止支持时,我们为你带来了一份python 3.x迁移指南
2018/01/30 Python
Pandas中把dataframe转成array的方法
2018/04/13 Python
使用python实现语音文件的特征提取方法
2019/01/09 Python
Django ORM 自定义 char 类型字段解析
2019/08/09 Python
HTML5+CSS3应用详解
2014/02/24 HTML / CSS
英国浴室洗脸盆购物网站:Click Basin
2018/06/08 全球购物
CK澳大利亚官网:Calvin Klein澳大利亚
2020/12/12 全球购物
医院工作检讨书范文
2014/02/10 职场文书
英语国培研修感言
2014/02/13 职场文书
境外导游求职信
2014/02/27 职场文书
关于开学的感想
2015/08/10 职场文书
如何解决goland,idea全局搜索快捷键失效问题
2022/04/03 Golang