jquery移动节点实例
本文实例讲述了jquery移动节点的实现方法,分享给大家供大家参考。具体实现方法如下:
方法很方便简单,使用 append()方法即可。代码如下:
<html>
<head>
<title>jquery移动节点</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(function(){
$("button").click(function(){
$("div").append($("p"));
});
});
</script>
<style type="text/css">
h5{color:blue;}
div{width:300px;height:60px;border:solid 1px green;}
div p{color:red;}
</style>
</head>
<body>
<h5>jquery移动节点</h5>
<button>点我</button>
<div>哈哈哈哈哈哈,太搞笑了</div>
<p>你太幽默了</p>
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。
相关推荐
-
jQuery复制节点用法示例(clone方法)
本文实例讲述了jQuery复制节点的方法.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type="text/
-
jQuery删除节点用法示例(remove方法)
本文实例讲述了jQuery删除节点的方法.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type="text/
-
jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)
本文实例讲述了jQuery插入节点和移动节点的方法.分享给大家供大家参考,具体如下: 1. 插入节点: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" ty
-
Jquery对新插入的节点 绑定Click事件失效的解决方法
1.有人说用 Live, 事实上现在最新的Jquery已经不支持 Live 了.live的解决方法如下: 你可以看这个 也可以不看 ,只是做到心中有数就可以了.下面介绍ON的方法. live:Live的使用介绍 2.有人用了ON 来解决, 这个解决方法基本在理. On :On的介绍,能解决问题 On的方法,基本能解决问题,但是你也要根据你的具体情况做选择.并不是每个人的代码都像上面这个案例描述的那么简单.但是万变不离其宗. 我是这样来做的,最终把问题解决了. 我有一个UL 标签是静态的,就是说不
-
jQuery遍历节点树方法分析
本文实例讲述了jQuery遍历节点树方法.分享给大家供大家参考,具体如下: demo.html <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type=&
-
JQuery插入DOM节点的方法
本文实例讲述了JQuery插入DOM节点的方法.分享给大家供大家参考.具体分析如下: 动态创建HTML元素并没有实际用处,还需要将新创建的元素插入文档中.将新创建的节点插入文档最简单的办法是,让它成为这个文档的某个节点的子节点.前面使用了一个插入节点的方法append(),它会在元素内部追加新创建的内容. 将新创建的节点插入某个文档的方法并非只有一种,在JQuery中还提供了其他儿种插入节点的方法,如下表所示.读者可以根据实际需求灵活地做出多种选择. HTML DOM结构如下: <p class
-
jQuery移动和复制dom节点实用DOM操作案例
本文章简单的介绍了关于jQuery移动和复制dom节点程序实现,有需要学习的朋友可参考参考. 在做一个项目时,需要dom节点移动,如以下代码: 复制代码 代码如下: <div></div> <p></p> 需要把p标签移动到div标签里,经过测试发现,在jQuery中移动dom节点非常方便: 复制代码 代码如下: $('div').append($('p')) 这样即可把p标签移动到div标签里,千万不要写成这样: 复制代码 代码如下: $('div').a
-
移动节点的jquery代码
复制代码 代码如下: //节点的移动 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF
-
jQuery替换节点用法示例(使用replaceWith方法)
本文实例讲述了jQuery替换节点的方法.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="js/jquery-1.10.1.min.js" type="text/
-
jQuery DOM插入节点操作指南
方法 描述 示例 append() 向每个匹配的元素内部追加内容 HTML代码:<p>我想说:</p> jQuery代码: $("p").append("<b>你好</b>"); 结果: <p>我想说:<b>你好</b></p> appendTo() 将所有匹配的元素追加到指定的元素中 .实际上,使用该方法是颠倒了常规 的$(A).append(B)的操作,是将A追加到B
-
jQuery:节点(插入,复制,替换,删除)操作
复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>jQuery插入,复制.替换和删除节点</title> <script type="text/javascript" src="jquery-1.3.2.js&q
随机推荐
- AJAX跨域请求数据的四种方法(实例讲解)
- java selenium教程之selenium详细介绍
- window.onload与$(document).ready()的区别分析
- WINDOWS下php5.2.4+mysql6.0+apache2.2.4+ZendOptimizer-3.3.0配置
- Android仿淘宝物流信息TimeLineView
- Shell脚本实现监控rsync数据是否传输完
- Javascript入门学习第八篇 js dom节点属性说明第1/2页
- VBS中CreateObject和WScript.CreateObject的区别介绍
- Python命名空间详解
- Windows Server 2008服务器管理新技巧6则第1/4页
- SQLServer中Partition By及row_number 函数使用详解
- Java 详解垃圾回收与对象生命周期
- javascript 日期时间函数(经典+完善+实用)
- jQuery插件之validation插件
- js之完全兼容ie与firefox的拖动层代码[测试好用]
- 简单实现nginx+tomcat的反向代理与动静分离
- 给ADSL Modem“软升级”实现路由
- asp.net使用H5新特性实现异步上传的示例
- 微信小程序实现点击按钮移动view标签的位置功能示例【附demo源码下载】
- 详解linux 看门狗驱动编写