Jquery操作ul的一些操作笔记
1、html标记
<ul id="attachText">
<li data-text="111"><a href="#">查看附件</a> <a href="#">删除</a></li>
<li data-text="222"><a href="#">查看附件</a> <a href="#">删除</a></li>
<li data-text="333"><a href="#">查看附件</a> <a href="#">删除</a></li>
</ul>
JS
1、获取 li属性 data-text的值用 ,隔开
function GetValues()
{
var values = "";
var obj = $("#attachText li");
if(obj.length>0)
{
var len = $(obj).length-1;
$.each(obj, function (index, value)
{
//表示为最后一个元素
if (index == len) {
values += $(value).attr("data-text");
}
else {
values += $(value).attr("data-text") + ",";
}
})
}
console.log(values);
}
输出结果;111,222,333
2、编辑的时候初始化ul的li项
function LoadAttach()
{
$("#attachText").html("");//先清空 var data="111,222,333";
var arr = data.split(',');
$.each(arr, function (index, value) {
$("#attachText").prepend("<li data-value=\"" + $.parseJSON(data).data + "\"><a>查看附件</a> <a>删除</a></li>");
});
}
Jquery操作ul的一些操作笔记的更多相关文章
- jquery 温故而知新 Ul 相关的操作
在UL中取得第一级的LI <div id='demo1'> <ul> <li id='1'>1<li> <li id='2'>2< ...
- HTML 学习笔记 JQuery(表单,表格 操作)
表单应用 一个表单有3个基本组成部分 (1)表单标签:包含处理表单数据所用的服务器端程序URL 以及数据提交到服务器的方法 (2)表单域:包含文本框 密码框 隐藏框 多行文本框 复选框 单选框 下拉选 ...
- jQuery 对表单、表格的操作及更多应用-简略笔记
[jQuery 对表单.表格的操作及更多应用] jquery对表单及表格的操作是实际应用中相当广泛. 对于表单的操作,可以实现 (1)获取和失去焦点改变样式: (2)在多行文本框中可以实现网站评论框的 ...
- 【学习笔记】锋利的jQuery(二)DOM操作
一.获取DOM节点 //找祖宗 parent() parents() closest() //找后代 children(); find(); //找兄弟 next()/nextAll() prev() ...
- jquery中的节点的操作
节点的操作 Dom 文档对象 模型 解决 一.插入节点 Append() 在每个匹配的元素中追加内容 Var $li_1= “<li></li>”; Var $li_2 = ...
- jQuery(3)——DOM操作
---恢复内容开始--- jQuery中的DOM操作 [DOM操作分类] DOM操作分为DOM Core(核心).HTML-DOM和CSS-DOM三个方面. DOM Core:任何一种支持DOM的 ...
- jQuery的属性,事件及操作
1.属性操作 1.1 基本属性操作 $("img").attr("src") 返回文档中所有图像的src属性值 $("img").attr( ...
- jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax
jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...
- JQuery第三天——CSS操作与JQuery事件
JQuery的CSS_DOM与样式操作 样式: 获取 class 和设置 class : class 是元素的一个属性, 所以获取 class 和设置 class 都可以使用 attr() 方法来完成 ...
随机推荐
- repo跟svn的区别
Git与SVN区别 Git和SVN正好相反,git提倡开发时拉分支,各干各的,相互独立,发版本时打标签:而svn呢,平时大家都在主干上干活,发版本时拉个分支,所以呢,svn经常会提交冲突,经常要合并代 ...
- easyui 日期控件,选择日期小于等于当前日期,开始日期小于等于结束日期
转载出处:http://blog.csdn.net/u013755149/article/details/76613028 $(function(){ $('#start_date').datebox ...
- Python小练习之判断一个日期是一年的第几天
python练手遇到的一个问题写了个统一公式,不用麻烦的分各种类,如果有人测试出错误请评论通知. #分单双月 def dayNum(month,day,isLeap): if month % 2 != ...
- Rabbitmq的使用及Web监控工具使用
本文转载自:https://www.cnblogs.com/gossip/p/4475978.html windows安装手册请参考:http://www.rabbitmq.com/install-w ...
- VS Code 调试 Angular 和 TypeScript 的配置
一.安装插件 在 Visual Studio Code 中打开扩展面板(快捷键 Ctrl+Shift+X),搜索安装 Debugger for chrome 插件). 二.配置启动参数 在 Visua ...
- 像纸质笔记本一样给div,textarea添加行的分割线
想要给textarea添加一个背景图来实现 但是背景图有几个问题, 1.每个div或者textarea的line-height不一样,对于每个不同的line-height都需要一个不同的背景图 2.当 ...
- Ubuntu 16.04下Samba服务器搭建和配置(配截图)
一.相关介绍 Samba是在Linux和UNIX系统上实现SMB协议的一个免费软件,由服务器及客户端程序构成.SMB(Server Messages Block,信息服务块)是一种在局域网上共享文件和 ...
- 京东购物车的 Java 架构实现及原理!
今天来写一下关于购物车的东西, 这里首先抛出四个问题: 1)用户没登陆用户名和密码,添加商品, 关闭浏览器再打开后 不登录用户名和密码 问:购物车商品还在吗? 2)用户登陆了用户名密码,添加商品,关闭 ...
- centos7使用wordpress布署网站(2)
1.接下来需要配置数据库,为使用wordpress做准备 修改认证方式: vim .../phpMyAdmin/config.inc.php [...] $cfg['Servers'][$i]['au ...
- Kali学习笔记32:Maltego、Exiftool
有段时间没学Kali里面的工具了 以前做信息收集的时候呢,忘记了两个很强大的工具:Maltego.Exiftool 先来看看Maltego: 这个工具不仅可以方便地收集DNS信息等等,强大地地方还在于 ...