Jquery的动态创建DOM元素

jquery动态创建页面元素，mark一下，以备以后查询时使用。以创建div和input为例。
动态创建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");
})

转载于:https://blog.51cto.com/minren8/482111

Jquery的动态创建DOM元素相关推荐

jQuery动态创建的元素无法删除？—— 事件委派找其静态父级
项目场景: 通过一个小案例学习事件委派时jQuery动态创建的元素无法移除. 问题描述案例需要动态添加表格行,点击GET可以移除此课程.但是后来动态创建的tr无法移除. var newtr = $( ...
js动态生产html元素,js 动态创建 html元素
js 动态创建 html元素 js学习之动态创建html元素 body{margin:0;padding:0;} .sky{background:#000;width:1000;height:500p ...
动态创建html元素的几种方法
可以通过以下几种方式动态创建html元素: 1.使用jQuery创建元素的语法 2.把动态内容存放到数组中,再遍历数组动态创建html元素 3.使用模版 □ 使用jQuery动态创建元素追加到jQue ...
可折叠的html元素,jQuery炫酷HTML DOM元素纸张3D折叠特效
oriDomi是一款非常神奇的jQuery炫酷HTML DOM元素纸张折叠特效.oriDomi能够将HTML DOM元素转换为纸张状态,你可以用鼠标来任意折叠它们.oriDomi可以折叠的不仅是静态图 ...
jquery append 动态添加的元素事件on 不起作用的解决方案
用jquery添加新元素很容易,面对jquery append 动态添加的元素事件on 不起作用我们该如何解决呢?on方法中要先找到原选择器(如例.info),再找到动态添加的选择器(如列.delet ...
html动态资源加载进度,JavaScript_快速解决js动态改变dom元素属性后页面及时渲染的问题，今天实现一个进度条加载过程 - phpStudy...
快速解决js动态改变dom元素属性后页面及时渲染的问题今天实现一个进度条加载过程,dom结构其实就是两个div 控制里层div的宽width属性,就能实现进度条往前走的效果. 我的进度条是显示下载文 ...
解决js动态改变dom元素属性后页面及时渲染问题
解决js动态改变dom元素属性后页面及时渲染问题参考文章: (1)解决js动态改变dom元素属性后页面及时渲染问题 (2)https://www.cnblogs.com/fangsmile/p/49 ...
jQuery常用的查找Dom元素方法
jQuery常用的查找Dom元素方法废话不多说,先来个总结,然后下面是demo 一. 同级节点之间的检索(检索深度N=0) next()是在兄弟节点中,往后匹配; prev()是在兄弟节点中,往前匹 ...
vue鼠标点击指定区域创建dom元素与编辑删除元素的思路
vue鼠标点击指定区域创建dom元素与编辑删除元素的思路话不多说有思路直接干一. 鼠标点击页面灰色背景创建红色元素二. 点击已经创建的红色元素则是编辑或者删除根据点击元素的类名来判断是属于创建 ...

Jquery的动态创建DOM元素

Jquery的动态创建DOM元素相关推荐

最新文章

热门文章