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 相关文章推荐
JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参
Jan 06 Javascript
jQuery插件实现表格隔行换色且感应鼠标高亮行变色
Sep 22 Javascript
IE中getElementsByName()对有些元素无效的解决方案
Sep 28 Javascript
异步JavaScript编程中的Promise使用方法
Jul 28 Javascript
在JavaScript中如何解决用execCommand(
Oct 19 Javascript
javascript拖拽应用实例
Mar 25 Javascript
Sea.JS知识总结
May 05 Javascript
JS中的数组转变成JSON格式字符串的方法
May 09 Javascript
angular实现spa单页面应用实例
Jul 10 Javascript
web3.js增加eth.getRawTransactionByHash(txhash)方法步骤
Mar 15 Javascript
通过jQuery学习js类型判断的技巧
May 27 jQuery
idea编译器vue缩进报错问题场景分析
Jul 04 Vue.js
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
点评山进PR-D3L三波段收音机
2021/03/02 无线电
在线短消息收发的程序,不用数据库
2006/10/09 PHP
php打开文件fopen函数的使用说明
2013/07/05 PHP
php中simplexml_load_string使用实例分享
2014/02/13 PHP
总结PHP删除字符串最后一个字符的三种方法
2016/08/30 PHP
PHP二维数组实现去除重复项的方法【保留各个键值】
2017/12/21 PHP
PHP 获取客户端 IP 地址的方法实例代码
2018/11/11 PHP
TP5框架实现上传多张图片的方法分析
2020/03/29 PHP
js获取提交的字符串的字节数
2009/02/09 Javascript
ExtJS 2.2.1的grid控件在ie6中的显示问题
2009/05/04 Javascript
JS date对象的减法处理实现代码
2010/12/28 Javascript
jQuery实现点击文本框弹出热门标签的提示效果
2013/11/17 Javascript
js抽奖实现随机抽奖代码效果
2013/12/02 Javascript
JQuery插入DOM节点的方法
2015/06/11 Javascript
jQuery切换所有复选框选中状态的方法
2015/07/02 Javascript
js实现对ajax请求面向对象的封装
2016/01/08 Javascript
JavaScript学习笔记之ES6数组方法
2016/03/25 Javascript
js实现的万能flv网页播放器代码
2016/04/30 Javascript
JavaScript原生对象常用方法总结(推荐)
2016/05/13 Javascript
javascript 正则表达式去空行方法
2017/01/24 Javascript
vue修改vue项目运行端口号的方法
2017/08/04 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
使用Node搭建reactSSR服务端渲染架构
2018/08/30 Javascript
Vue-input框checkbox强制刷新问题
2019/04/18 Javascript
Layui带搜索的下拉框的使用以及动态数据绑定方法
2019/09/28 Javascript
[01:36]DOTA2完美大师赛趣味视频之与队友相处的十万个技巧
2017/11/19 DOTA
Python3实现从文件中读取指定行的方法
2015/05/22 Python
Python中取整的几种方法小结
2017/01/06 Python
Django卸载之后重新安装的方法
2017/03/15 Python
python下PyGame的下载与安装过程及遇到问题
2019/08/04 Python
Python OpenCV视频截取并保存实现代码
2019/11/30 Python
小 200 行 Python 代码制作一个换脸程序
2020/05/12 Python
Python爬虫进阶之爬取某视频并下载的实现
2020/12/08 Python
html5通过canvas实现刮刮卡效果示例分享
2014/01/27 HTML / CSS
美国知名的在线旅游服务网站:Priceline
2016/07/23 全球购物
2014年采购工作总结
2014/11/20 职场文书