基于Jquery的动态创建DOM元素的代码


Posted in Javascript onDecember 28, 2010

动态创建div:

$(function(){ 
$("<div>",{ 
id: 'test', 
text: 'this is a test', 
"class": "test", 
click: function(){ 
$(this).toggleClass('test'); 
} 
}).appendTo("body"); 
})

动态创建input:
$(function(){ 
$("<input>", { 
type: 'text', 
val: 'test', 
focusin: function() { 
$(this).addClass('active'); 
}, 
focusout: function() { 
$(this).removeClass('active'); 
} 
}).appendTo("body"); 
})
Javascript 相关文章推荐
jquery实现网页查找功能示例分享
Feb 12 Javascript
js 与 php 通过json数据进行通讯示例
Mar 26 Javascript
浅谈js 闭包引起的内存泄露问题
Jun 22 Javascript
Javascript中的作用域和上下文深入理解
Jul 03 Javascript
jQuery实现连续动画效果实例分析
Oct 09 Javascript
jQuery模仿单选按钮选中效果
Jun 24 Javascript
2种简单的js倒计时方式
Oct 20 Javascript
Angular6 发送手机验证码按钮倒计时效果实现方法
Jan 08 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
Apr 10 Javascript
JS使用cookie保存用户登录信息操作示例
May 30 Javascript
Layui 导航默认展开和菜单栏选中高亮设置的方法
Sep 04 Javascript
JS关闭子窗口并且刷新上一个窗口的实现示例
Mar 10 Javascript
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
Apr 04 #Javascript
基于Jquery的标签智能验证实现代码
Dec 27 #Javascript
jQuery powerFloat万能浮动层下拉层插件使用介绍
Dec 27 #Javascript
在JavaScript中获取请求的URL参数[正则]
Dec 25 #Javascript
extjs之去除s.gif的影响
Dec 25 #Javascript
javascript常用方法、属性集合及NodeList 和 HTMLCollection 的浏览器差异
Dec 25 #Javascript
javascript与webservice的通信实现代码
Dec 25 #Javascript
You might like
PHP基础知识介绍
2013/09/17 PHP
PHP.ini中配置屏蔽错误信息显示和保存错误日志的例子
2014/05/12 PHP
什么是PEAR?什么是PECL?PHP中两个容易混淆的概念解释
2015/07/01 PHP
PHP入门教程之操作符与控制结构流程详解
2016/09/09 PHP
关于ThinkPhp 框架表单验证及ajax验证问题
2017/07/19 PHP
记录Yii2框架开发微信公众号遇到的问题及解决方法
2018/07/20 PHP
ExtJs之带图片的下拉列表框插件
2010/03/04 Javascript
iframe如何动态创建及释放其所占内存
2014/09/03 Javascript
jQuery中queue()方法用法实例
2014/12/29 Javascript
jquery表单验证插件(jquery.validate.js)的3种使用方式
2015/03/28 Javascript
jQuery结合AJAX之在页面滚动时从服务器加载数据
2015/06/30 Javascript
jquery实现的点击翻书效果代码
2015/11/04 Javascript
Bootstrap按钮组件详解
2016/04/26 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
JS实现手写parseInt的方法示例
2017/09/24 Javascript
vue封装第三方插件并发布到npm的方法
2017/09/25 Javascript
javaScript字符串工具类StringUtils详解
2017/12/08 Javascript
浅谈redux以及react-redux简单实现
2018/08/28 Javascript
如何为你的JS项目添加智能提示与类型检查详解
2019/03/12 Javascript
详解vue使用插槽分发内容slot的用法
2019/03/28 Javascript
详解vue-cli3多环境打包配置
2019/03/28 Javascript
通过实例解析JavaScript常用排序算法
2020/09/02 Javascript
js实现鼠标滑动到某个div禁止滚动
2020/09/17 Javascript
详解Python map函数及Python map()函数的用法
2017/11/16 Python
python实现人脸识别经典算法(一) 特征脸法
2018/03/13 Python
python数据库编程 ODBC方式实现通讯录
2020/03/27 Python
解决keras backend 越跑越慢问题
2020/06/18 Python
详解如何获取localStorage最大存储大小的方法
2020/05/21 HTML / CSS
装潢设计专业推荐信模板
2013/11/26 职场文书
债务纠纷委托书
2014/08/30 职场文书
挂职学习心得体会
2014/09/09 职场文书
2014年大学学生会工作总结
2014/12/02 职场文书
医护人员继续教育学习心得体会
2016/01/19 职场文书
详解Flask开发技巧之异常处理
2021/06/15 Python
Html5同时支持多端sdk的小技巧
2021/11/17 HTML / CSS
python中pycryto实现数据加密
2022/04/29 Python