jQuery:节点(插入,复制,替换,删除)操作


Posted in Javascript onMarch 04, 2013
<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"></script> 
<script type="text/javascript"> 
   $(document).ready(function(){ 
     //几种添加节点的方法 
    //$("p").append("<b>你好吗?</b>");//向p元素中追加《b》 
    //$("<b>你好吗?</b>").appendTo("p");//将《b》追加到p元素中 
    //$("p").prepend("<b>你好吗?</b>");//向p中前置《b》 
    //$("<b>你好吗?</b>").prependTo("p");//将《b》前置到p元素中 
    //$("p").after("<b>你好吗?</b>");//向p元素后插入《b》 
    //$("<b>你好吗?</b>").insertAfter("p");//将《b》插入到p元素后边 
    //$("p").before("<b>你好吗?</b>");//在p元素之前添加《b》 
    //$("<b>你好吗?</b>").insertBefore("p");//将《b》插入到p元素前面    
      //几种删除节点的方法 
    //var $li=$("ul li:eq(1)").remove();//删除ul节点中第2个元素节点 
    //$("ul").append($li);//把刚删除的元素节点从新添加到ul元素中去 
    //$("ul li").remove("li[title!=菠萝]");//将ul元素下title属性不等于"菠萝"的li元素删除 
    //$("ul li:eq(1)").empty();//清空ul节点下第2个li元素的内容 
    //复制节点 
   /* $("ul li").click(function(){ 
     $(this).clone(true).appendTo("ul");//复制当前点击的节点,并将它追加到《ul》元素中,当添加参数时复制它的事件 
    }); 
    */ 
    //替换节点 
   // $("p").replaceWith("<strong>你最不喜欢的水果是?</Strong>");   
   }); 
</script> 
</head> 
<body> 
   <p>你好!</p> 
   你最喜欢的水果是? 
   <ul> 
    <li title="苹果">苹果</li> 
    <li title="橘子">橘子</li> 
    <li title="菠萝">菠萝</li> 
    </ul> 
</body> 
</html>
Javascript 相关文章推荐
用js判断浏览器是否是IE的比较好的办法
May 08 Javascript
javascript中的undefined和not defined区别示例介绍
Feb 26 Javascript
基于jQuery的图片不完全按比例自动缩小
Jul 11 Javascript
jquery专业的导航菜单特效代码分享
Aug 29 Javascript
使用JS 插件qrcode.js生成二维码功能
Feb 20 Javascript
jQuery事件与动画基础详解
Feb 23 Javascript
微信小程序实现倒计时补零功能
Jul 09 Javascript
WebGL three.js学习笔记之阴影与实现物体的动画效果
Apr 25 Javascript
JS匿名函数内部this指向问题详析
May 10 Javascript
layer.js之回调销毁对话框的例子
Sep 11 Javascript
js实现省级联动(数据结构优化)
Jul 17 Javascript
Element Tooltip 文字提示的使用示例
Jul 26 Javascript
JS获取后台Cookies值的小例子
Mar 04 #Javascript
JQuery获取各种宽度、高度(format函数)实例
Mar 04 #Javascript
javascript加号&quot;+&quot;的二义性说明
Mar 04 #Javascript
js给dropdownlist添加选项的小例子
Mar 04 #Javascript
jQuery侧边栏随窗口滚动实现方法
Mar 04 #Javascript
利用js实现选项卡的特别效果的实例
Mar 03 #Javascript
DWZ刷新dialog解决方法
Mar 03 #Javascript
You might like
初探PHP5
2006/10/09 PHP
php写的简易聊天室代码
2011/06/04 PHP
PHP基础之运算符的使用方法
2013/04/28 PHP
PHP实现合并discuz用户
2015/08/05 PHP
php版微信公众平台接口参数调试实现判断用户行为的方法
2016/09/23 PHP
php使用crypt()函数进行加密
2017/06/08 PHP
Js参数值中含有单引号或双引号问题的解决方法
2013/11/06 Javascript
控制文字内容的显示与隐藏示例
2014/06/11 Javascript
jQuery通过扩展实现抖动效果的方法
2015/03/11 Javascript
利用JavaScript判断浏览器类型及版本
2016/08/23 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
JS实现checkbox互斥(单选)功能示例
2019/05/04 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
2019/08/12 Javascript
Electron 调用命令行(cmd)
2019/09/23 Javascript
如何在postman测试用例中实现断言过程解析
2020/07/09 Javascript
[31:29]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第一场 12.20
2020/12/23 DOTA
Python实现TCP/IP协议下的端口转发及重定向示例
2016/06/14 Python
使用TensorFlow实现SVM
2018/09/06 Python
python调用java的jar包方法
2018/12/15 Python
对python内置map和six.moves.map的区别详解
2018/12/19 Python
基于Python实现迪杰斯特拉和弗洛伊德算法
2020/05/27 Python
检测浏览器是否支持html5视频的代码
2013/03/28 HTML / CSS
李维斯德国官方网上商店:Levi’s德国
2016/09/10 全球购物
俄罗斯在线购买飞机票、火车票、巴士票网站:Tutu.ru
2020/03/16 全球购物
一百多行代码实现react拖拽hooks
2021/03/23 Javascript
小学教师岗位职责
2013/11/25 职场文书
办护照工作证明范本
2014/01/14 职场文书
图书室管理制度
2014/01/19 职场文书
毕业生求职信的经典写法
2014/01/31 职场文书
统计系教授推荐信
2014/02/28 职场文书
2014幼儿园家长工作总结
2014/11/10 职场文书
给老婆道歉的话
2015/01/20 职场文书
三孔导游词
2015/02/05 职场文书
销售区域经理岗位职责
2015/04/10 职场文书
2016年元旦致辞
2015/08/01 职场文书