手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >用JQUERY增删元素的代码
用JQUERY增删元素的代码
摘要:用JQUERY增删元素JQuery有增加和删除元素的方法。主要分为内部插入,外部插入,包裹,替换,删除。内部插入主要方法:append(co...

用JQUERY增删元素

JQuery有增加和删除元素的方法。

主要分为内部插入,外部插入,包裹,替换,删除。

内部插入主要方法:

append(content) 向每个匹配的元素内部追加内容。

prepend(content) 向每个匹配的元素内部前置内容。

外部插入:

after(content) 在每个匹配的元素之后插入内容。

before(content) 在每个匹配的元素之前插入内容。

删除:

empty() 删除匹配的元素集合中所有的子节点。

remove([expr]) 从DOM中删除所有匹配的元素。

下面的例子是点击增加按钮表格就会在最后一行插入新的一行

再点击删除按钮删除最后一行

用JQUERY增删元素的代码1

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>表格元素增删</title>

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>

<style type="text/css">

body{ font-size:12px;}

</style>

<script type="text/javascript">

/* 添加预测 */

function add_tr() {

$("#table1").append("<tr>" + $("#table1 tr").eq(0).html() + "</tr>");

}

/* 删除预测 */

function remove_tr() {

//alert($("#table1 tr").last().html());

if ($("#table1 tr").size() > 1) {

$("#table1 tr:last-child").remove();

}

else

alert("这是最后一行,无法再删除");

}

</script>

</head>

<body align='center'>

<center>

<table id='table1'>

<tr>

<td width='150'>第一格</td>

<td width='250'><input type='text'/></td>

</tr>

</table>

<br/>

<input type='button' value='增加一行' onclick='add_tr()' />

<input type='button' value='删除最后一行' onclick='remove_tr()' />

</center>

</body>

</html>

【用JQUERY增删元素的代码】相关文章:

jQuery子窗体取得父窗体元素的方法

VBScript版代码高亮

用JavaScript实现页面重定向功能的教程

必须点击广告才能进入的代码

用户输入密码的强度

JQUERY表单暂存功能插件分享

使用RequireJS优化JavaScript引用代码的方法

简单的防盗链功能代码(iframe)

些很实用且必用的小脚本代码

网页常用特效代码整理

精品推荐
分类导航