用JQ实现基础的添加,插入,删除功能。

在eclipse里面运行代码即可,如果您是其他应用,请选择对您有帮助的代码即可,如果有写错或不懂的地方请联系QQ:1633420056,谢谢,祝学习进步

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../jq/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
function fn1() { //添加
//获取用户的输入内容
var userName = $("#userName").attr("value");
//创建li标签并添加内容
var $li = $("<li>" + userName + "</li>");
//把li装ul
$("#aa").append($li);
}
function fn2() { //插入
var userName = $("#userName").attr("value");
var $li = $("<li>" + userName + "</li>");
$("#sh").after($li)
}
function fn3() { //删除
//通过元素自己删除
//$("#sh").remove();
//先得到所有的li 然后删除里面id为sh的
$("li").remove("#sh");
}
</script>
</head>
<body>
<input type="text" id="userName">
<input type="button" value="添加" onclick="fn1()">
<input type="button" value="插入" onclick="fn2()">
<input type="button" value="删除" onclick="fn3()">

<ul id="aa">
<li>北京</li>
<li id="sh">上海</li>
<li>广州</li>
</ul>
</body>
</html>

原文地址:https://www.cnblogs.com/xiejiali/p/10886837.html

时间: 2024-11-19 12:34:58

用JQ实现基础的添加,插入,删除功能。的相关文章

jQuery---jq操作标签文本(html(),text()),jq操作文档标签(插入,删除,修改),克隆,,jq操作属性,jq操作class属性,jq操作表单value,jq操作css,jq操作盒子(重要),jq操作滚动条

jQuery---jq操作标签文本(html(),text()),jq操作文档标签(插入,删除,修改),克隆,,jq操作属性,jq操作class属性,jq操作表单value,jq操作css,jq操作盒子(重要),jq操作滚动条 一丶jQ操作标签内文本 html() 标签元素中的内容 /** 替换的内容可以使一个js对象,jq对象,文本 **/ /* 获取值:获取选中标签元素的所有内容 ,包括标签*/ $('ul').html() " <li>1</li> <li&g

使用EasyUI实现添加和删除功能

        增删该查是任何一个项目都少不了的功能操作,这篇博文主要简介一下如何使用EasyUI实现添加和删除功能.         首先,导入EasyUI的js代码: <link href="~/EasyuiSource/themes/default/easyui.css" rel="stylesheet" /> <link href="~/EasyuiSource/themes/icon.css" rel="st

FileSystemObject组件新建读取添加修改删除功能实例

<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>FileSystemObject组件应该实例</title> </head> <

Ubuntu下wxWidgets学生公寓管理编程,sqlite3的用法(mysql数据库),窗体,下面是部分添加和删除功能,其他功能可以联系我。。

以下是学生公寓信息管理的增加和删除,仅供参考.. void StuManaFrame::OnAdd(wxCommandEvent &event) { //add student's dormitory infomation sqlite3 *db=NULL; int flag; char *errmsg; flag = sqlite3_open("./stuinfo.db",&db); if(SQLITE_OK != flag) { wxLogMessage("

自定义listView添加滑动删除功能

今天研究了一下android里面的手势,结合昨天学习的自定义View,做了一个自定义的listview,继承自listView,添加了条目的滑动手势操作,滑动后出现一个删除按钮,点击删除按钮,触发一个删除的事件,在事件中进行删除当选行的元素,刷新listview. 一共分为以下几步进行: 1.新建一个按钮的布局文件,用来作为动态添加的按钮:layout_button.xml <?xml version="1.0" encoding="utf-8"?> &

react.js 之 批量添加与删除功能

最近做的CMS需要用到批量添加图片的功能:在添加文件的容器盒子内,有两个内容,分别是:添加按钮与被添加的选择文件组件. 结构分析: 被添加的组件,我们称为:UploadQiNiuFiles(七牛文件上传组件),含一个删除当前组件的删除按钮 添加按钮的事件 被添加组件存放的容器 代码分析: 添加组件存放的容器:<div className="divBorder"> <div className="divBorder"> {addToBtn} /

可变数组:创建 添加 插入 删除 替换

#import <Foundation/Foundation.h> int main(int argc, const char * argv[]) { @autoreleasepool { //可变数组继承不可变数组 //1创建 设定元素个数进行创建 NSMutableArray *str=[NSMutableArray arrayWithCapacity:7]; //2想数组中添加一个元素 NSArray *[email protected][@"MON",@"

2015-07-22 JQuery 第二课(JQ元素获取,添加,删除,判断,遍历,取值,样式设置,改变对象,切换)

1.获取元素: 1).size(): 获取元素的个数. $(“img”).size():获取有多少个img. 2).eq():获取元素. $(“img[title]”).eq(1):获取第二个带有title属性的img标签. 也可以写作: $(“img[title]”)[1],此括号里的1代表索引1,所以是对应第二个,一般多用eq(). 3).get() :获得由选择器指定的DOM元素. x=$("p").get(0):获取第一个 p 元素的值. 4)index():获取某项标签的索引

web测试点整理(四) -- 添加/修改/删除功能

声明:是参考了很多他人的文章以及自己的一些经验做了总结,因为时间久远,也没有留下当时的参考链接,如果涉及引用别人的内容,请留言说明,谢谢 添加.修改 特殊键 是否支持Tab键 是否支持回车键 提示信息 不符合要求的地方是否有错误提示 唯一性 字段唯一的,是否可以重复添加,添加后是否能修改为已存在的字段(字段包括区分大小写以及在输入的内容前后输入空格,保存后,数据是否真的插入到数据库中,注意保存后数据的正确性) 数据正确性: 对编辑页的每个编辑项进行修改,点击保存,是否可以保存成功,检查相关联的数