JQuery在页面中添加和除移DOM示例代码


Posted in Javascript onJune 24, 2013

1.before():将新节点添加到前面

2.after():将节点添加到低部

3.prepend():把节点变成第一个节点

4.append():把新节点添加到末端,与appendTo()效果相同,只是语法上有差异

5.remove():除移节点

示例:

<ul> 
<li class="vacation"> 
<h2>Hawaiian Vac</h2> 
<button>Get Price</button> 
</li> 
</ul>

实现:
<script type="text/javascript"> 
$(document).ready(function () { 
$('.vacation').before(price); //将新节点添加到前面 
$('.vacation').after(price);//将节点添加到低部 
$('.vacation').prepend(price); //把节点变成<li>的第一个节 
var price = $('<p>From $399.99</p>'); //在JQuery中创建一个dom 
//$('.vacation').append(price); //把新节点添加到末端,等于price.appendTo($('.vacation'));,语法不同 
price.appendTo($('.vacation'));//把新节点添加到末端 
$('button').remove(); //除移节点 
}); 
</script>
Javascript 相关文章推荐
jquery判断字符输入个数(数字英文长度记为1,中文记为2,超过长度自动截取)
Oct 15 Javascript
把jQuery的类、插件封装成seajs的模块的方法
Mar 12 Javascript
jQuery.Highcharts.js绘制柱状图饼状图曲线图
Mar 14 Javascript
javascript日期格式化方法汇总
Oct 04 Javascript
jQuery form插件的使用之处理server返回的JSON, XML,HTML数据
Jan 26 Javascript
Bootstrap表格和栅格分页实例详解
May 20 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
Jun 14 Javascript
微信小程序 引用其他js文件实现代码
Feb 22 Javascript
JS 设置Cookie 有效期 检测cookie
Jun 15 Javascript
利用canvas实现的加载动画效果实例代码
Jul 05 Javascript
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
微信小程序仿通讯录功能
Apr 09 Javascript
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
Jun 24 #Javascript
js实现右下角可关闭最小化div(可用于展示推荐内容)
Jun 24 #Javascript
javascript截取字符串(通过substring实现并支持中英文混合)
Jun 24 #Javascript
原生Js实现元素渐隐/渐现(原理为修改元素的css透明度)
Jun 24 #Javascript
原生Js页面滚动延迟加载图片实现原理及过程
Jun 24 #Javascript
jquery可见性过滤选择器使用示例
Jun 24 #Javascript
jquery子元素过滤选择器使用示例
Jun 24 #Javascript
You might like
PHP中的自动加载操作实现方法详解
2019/08/06 PHP
javascript json 新手入门文档
2009/12/03 Javascript
jquery中的常用事件bind、hover、toggle等示例介绍
2014/07/21 Javascript
浅谈Sizzle的“编译原理”
2015/04/14 Javascript
浅谈javascript的分号的使用
2015/05/12 Javascript
JS组件Bootstrap ContextMenu右键菜单使用方法
2016/04/17 Javascript
深入理解js promise chain
2016/05/05 Javascript
AngularJS ng-change 指令的详解及简单实例
2016/07/30 Javascript
Vue计算属性的学习笔记
2017/03/22 Javascript
微信小程序 Buffer缓冲区的详解
2017/07/06 Javascript
jQuery访问json文件中数据的方法示例
2019/01/28 jQuery
javascript实现的字符串转换成数组操作示例
2019/06/13 Javascript
[02:51]DOTA2英雄基础教程 艾欧
2014/01/13 DOTA
Python入门篇之数字
2014/10/20 Python
详解python3实现的web端json通信协议
2016/12/29 Python
python实现自动网页截图并裁剪图片
2018/07/30 Python
python 求10个数的平均数实例
2019/12/16 Python
pytorch 归一化与反归一化实例
2019/12/31 Python
打包PyQt5应用时的注意事项
2020/02/14 Python
基于python-pptx库中文文档及使用详解
2020/02/14 Python
Python xlrd excel文件操作代码实例
2020/03/10 Python
python用什么编辑器进行项目开发
2020/06/17 Python
详解appium自动化测试工具(monitor、uiautomatorviewer)
2021/01/27 Python
ROSEFIELD手表荷兰官方网上商店:北欧极简设计女士腕表品牌
2018/01/24 全球购物
SkinCeuticals官网:美国药妆品牌
2018/04/19 全球购物
Araks官网:纽约内衣品牌
2020/10/15 全球购物
玩具公司的创业计划书
2013/12/31 职场文书
拖鞋店创业计划书
2014/01/15 职场文书
前厅部经理岗位职责范文
2014/02/04 职场文书
新闻报道策划方案
2014/06/11 职场文书
基层党组织整改方案
2014/10/25 职场文书
悬崖上的金鱼姬观后感
2015/06/15 职场文书
2019自荐信范文集锦!
2019/07/03 职场文书
浅谈Redis存储数据类型及存取值方法
2021/05/08 Redis
JavaScript流程控制(循环)
2021/12/06 Javascript
分享python函数常见关键字
2022/04/26 Python