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

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>

时间: 2025-01-27 07:47:37

JQuery在页面中添加和除移DOM示例代码_jquery的相关文章

用jQuery向div中添加Html文本内容的简单实现_jquery

前台代码: <link href="http://www.jb51.net/Content/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="http://www.jb51.net/Scripts/jquery-1.4.4.min.js" type="text/javascript">

jQuery将多条数据插入模态框的示例代码_jquery

//Bootstrap模态框(局部) <div class="modal fade" id="orderDetail"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> </div> <div class="modal

jquery获得页面元素的坐标值实现思路及代码_jquery

jquery如何获得页面元素的坐标值 yulutxt是输入经典语录的输入框,feedBackMessage函数见http://www.wesoho.com/article/asp/2765.htm 复制代码 代码如下: var p = $("#yulutxt"); var yuluoffset = p.offset(); feedBackMessage(msg,yuluoffset.left+p.width()+10,yuluoffset.top,5000); ------------

JQuery中dataGrid设置行的高度示例代码_jquery

复制代码 代码如下: columns:[[ {field:"activitycontent",title:'活动内容',width:fixWidth(0.18),align:"center",halign:"center", formatter:function(value,rec){ if(value.indexOf("src")<0){ if(rec.activitycontent.length>Math.ce

JQuery以JSON方式提交数据到服务端示例代码_jquery

JQuery将Ajax数据请求进行了封装,从而使得该操作实现起来容易许多.以往我们要写很多的代码来实现该功能,现在只需要调用$.ajax()方法,并指明请求的方式.地址.数据类型,以及回调方法等.下面的代码演示了如何将客户端表单数据封装成JSON格式,然后通过JQuery的Ajax请求将数据发送到服务端,并最终将数据存储到数据库中.服务端定义为一个.ashx文件,事实上你可以将服务端定义为任何能接收并处理客户端数据的类型,如Web Service,ASP.NET Page,Handler等. 首

同域jQuery(跨)iframe操作DOM(示例代码)_jquery

frame目前还是比较流行的,许多地方都通过它来实现特殊的情况.比如说传统的上传.select在ie6下.代理.跨域等等.今天呢,简要的记述一下跨iframe的相关操作,主要是用jQuery操作DOM结构方面. 复制代码 代码如下: <iframe src="a.php" id="aa"></iframe> <iframe src="b.php" id="bb"></iframe>

jquery判断元素的子元素是否存在的示例代码_jquery

jquery判断子元素是否存在   一.判断子元素是否存在   //一级子元素 if($("#specialId>img").length==0)     if ($( "#specialId:has(img)" ).length==0)          {      //-----没有img子标记-----     }    else     {      //-------有img子标记------     }    二.选择特定id元素下的特定id子元

jquery实现省市select下拉框的替换(示例代码)_jquery

省市对应的实现:<还有一些没封装起来> 更具选择的省份来确定市的内容 jsp代码: 复制代码 代码如下: <body>  省份<select name="prin">   <option>--请选择--</option>   <option>福建</option>   <option>北京</option>   <option>山东</option>   

VBScript基础教程之二在HTML页面中添加VBscript代码

vbscript|基础教程|页面 SCRIPT 元素用于将 VBScript 代码添加到 HTML 页面中. <SCRIPT> 标记 VBScript 代码写在成对的 <SCRIPT> 标记之间.例如,以下代码为一个测试传递日期的过程: <SCRIPT LANGUAGE="VBScript"> <!-- Function CanDeliver(Dt) CanDeliver = (CDate(Dt) - Now()) > 2 End Fun