jquery下插入标签以及clone的应用
//内部插入 插入一个儿子
//var $ele = $("<h1></h1>")//创建h1标签
// $ele.html('hello')
// $ele.css('color','red')
//$('.c1').append($ele) //内部插入到后面
//$ele.appendTo('.c1')
// $('.c1').prepend($ele)//插入到前面
// $ele.prependTo('.c1')
//外部查ru 插入一个兄弟
/* $('.c1').after($ele)
$('.c1').before($ele)
$ele.insertAfter('.c1')
$ele.insertBefore('.c1')*/
//替换
// $('p').replaceWith($ele) //清空
// $('.c1').empty()//清空内部内容
// $('.c1').remove()//把自己也清空
clone的应用
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery文档处理</title>
</head>
<body>
<div class="outer">
<div class="item">
<button onclick="add(this)">+</button>
<input type="text">
</div>
</div>
<script src="/static/jquery.min.js"></script>
<script>
function add(self) {
var $clone_obj = $(self).parent().clone(true)//加上true之后,绑定的事件就不绑定了
$clone_obj.children('button').text('-').attr('onclick', 'remove_obj(this)') $('.outer').append($clone_obj)
}
function remove_obj(self) {
$(self).parent().remove()
}
</script> </body>
</html>
jquery下插入标签以及clone的应用的更多相关文章
- js往标签下插入标签的方法
js="document.getElementsByClassName('CodeMirror-line')[0].innerHTML = 'xxxxxx'"dr.execute_ ...
- 测开之路一百零三:jquery元素和标签的插入与删除
标签内插入 标签外插入 给标签加标签 !DOCTYPE html><html lang="en"><head> <meta charset=&q ...
- jquery 学习(四) - 标签 添加/删除/修改
HTML代码 <div class="a1"> <div> <span id="a2">aaa</span> & ...
- 可控制导航下拉方向的jQuery下拉菜单代码
效果:http://hovertree.com/texiao/nav/1/ 代码如下: <!DOCTYPE html> <html> <head> <meta ...
- jQuery触发a标签点击事件-为什么不跳转
今天开发发现 使用jQuery触发a标签的点击事件,当前的样式发生了变化,可是没有跳转,为什么? 百度后找到的解决方案: <a onclick="hanle()" href= ...
- jquery 下拉框 收藏
jquery 下拉框 Query获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code. ...
- IE下script标签的readyState属性
在做加载器时遇到一个常见问题,如何判定一个脚本已经执行完毕. "uninitialized" – 原始状态 "loading" – 下载数据中 "lo ...
- jquery下json数组的操作用法实例
jquery下json数组的操作用法实例: jquery中操作JSON数组的情况中遍历方法用的比较多,但用添加移除这些好像就不是太多了. 试过json[i].remove(),json.remove( ...
- Ajax jQuery下拉框联动案例
需求: 使用ajax和jQuery实现下拉框联动. 注意:需要加入jquery-2.1.1.min.js 前台 <!DOCTYPE html> <html> <head& ...
随机推荐
- [转][CentOS]修改IP后立即生效
来自:http://bbs.51cto.com/thread-789908-1.html Linux系统里修改IP地址后该如何使之即刻生效,有两种方法可以解决: (1) sudo ifdown eth ...
- Java项目配置redis
成功配置redis之后,便来学习使用redis.首先了解下redis的数据类型. Redis的数据类型 Redis支持五种数据类型:string(字符串),hash(哈希),list(列表),set( ...
- BrowserSync前端同步测试工具
安装教程
- [UE4]位与字节
位 1.bit,比特 2.一个位可以表示两个值,0或者1(一个位只能表示0或者1,并不是能同时表示0和1). 3.一个位为什么只能是2个值,而不能是3个值呢?这是由于技术因素造成的,在硬件中,如果用一 ...
- [UE4]蓝图使用GameMode重构
GameMode的生命周期贯穿整个游戏,当然也包括各个关卡.因此可以把各个关卡都需要的功能放置在GameMode,以达到功能共享.重复利用的目的!
- vue todolist 封装localstorage
//封装操作localstorage本地存储的方法 模块化的文件 // nodejs 基础 var storage={ set(key,value){ localStorage.setItem(key ...
- Java 3-Java 基本数据类型
Java 基本数据类型 变量就是申请内存来存储值.也就是说,当创建变量的时候,需要在内存中申请空间. 内存管理系统根据变量的类型为变量分配存储空间,分配的空间只能用来储存该类型数据. 因此,通过定义不 ...
- NodeJs安装以及注意事项
1.测试NodeJs是否安装成功 node --version npm -v 配置node的可执行文件路径到环境变量path 2.安装相关环境 npm install express -g npm i ...
- 剑指offer(一):二维数组中的查找
说明: 1.本系列是根据<剑指Offer>这个系列做的一个小笔记. 2.直接动力是因为师兄师姐找工作很难,而且机械出生的我面试算法更难. 3.刚开始准备刷LeetCode.LintCode ...
- Oracle bacic
1.连接Oracle 2.操作数据库 3.单表查询 4.SUID 5.常用函数 6.集合运算 7.Oracle 对象 8.PL/SQL 9.存储函数 10.存储过程 11.触发器 1.连接到数据库 O ...