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() 方法来完成 ...
随机推荐
- Nginx 教程(3):SSL 设置
SSL 和 TLS SSL(Socket Secure Layer 缩写)是一种通过 HTTP 提供安全连接的协议. SSL 1.0 由 Netscape 开发,但由于严重的安全漏洞从未公开发布过.S ...
- Windows 10 无法使用搜索栏,显示一片空白
查看这个:https://blog.csdn.net/qq_41571056/article/details/82928919
- 10-Mock模拟接口返回数据
1.安装mock 方法一:pip安装 命令行直接输入:pip install mock 方法二:官网下载mock安装包安装 下载安装包后,解压,命令行进入解压目录,执行python setup.py ...
- ORACLE知识点总结
一.ORACEL常用命令 1.解锁账户:ALTER USER username ACCOUNT UNLOCK; 2.查看数据库字符集:SELECT USERENV ('language') FROM ...
- Linux的50个基本命令
1.ls -a 列出当前目录下的所有文件,包括以.头的隐含文件(如-/.bashrc) ls –l 列出当前目录下文件的详细信息 2. pwd 查看当前所在目录的绝对路经 3. cd 目录之间的移动 ...
- electron-builder 由于网络原因无法下载问题解决
electron-builder 由于网络原因无法下载问题解决 在package.json的build中添加electron的镜像 "electronDownload": { &q ...
- Day8:html和css
Day8:html和css 显示和隐藏: display: none 为 无,隐藏元素 display: block 为 显示元素 转换为块级元素 visibility: visible 显示 vis ...
- 为什么 array.foreach 不支持 async/await
一.背景 react 项目中,渲染组件时,显示的数据一直有问题,本来以为是 react 组件的问题,后来才发现罪魁祸首在 fetch 数据的过程,因为我用了 async/await ,而却搭配了 fo ...
- vmware中nat模式中使用静态ip后无法上网的问题
在/etc/network/interfaces中添加静态ip auto eth0iface eth0 inet staticaddress 192.168.31.133netmask 255.255 ...
- java开发个人简历
求职意向 Java开发工程师 陈 楠 性 别:男 出生年月 :1995.07 民 族:汉族 联系方式 :159-3306-7520 学 历:本科 电子邮件 :15933067520@163.com 教 ...