day56

参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-11-0

each

jQuery.each(collection, callback(indexInArray, valueOfElement)):

描述:一个通用的迭代函数,它可以用来无缝迭代对象和数组。数组和类似数组的对象通过一个长度属性(如一个函数的参数对象)来迭代数字索引,从0到length - 1。其他对象通过其属性名进行迭代。

li =[10,20,30,40]
$.each(li,function(i, v){
console.log(i, v);//index是索引,ele是每次循环的具体元素。
})

输出:

010
120
230
340

示例:

11each循环示例.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>each循环示例</title>
</head>
<body> <div>111</div>
<div>222</div>
<div>333</div>
<div>444</div>
<div>555</div>
<script src="jquery-3.2.1.min.js"></script>
</body>
</html>

实践:

each遍历数组:

不能用break退出:

.data()

在匹配的元素集合中的所有元素上存储任意相关数据或返回匹配的元素集合中的第一个元素的给定名称的数据存储的值。

.data(key, value):

描述:在匹配的元素上存储任意相关数据。

$("div").data("k",100);//给所有div标签都保存一个名为k,值为100

.data(key):

描述: 返回匹配的元素集合中的第一个元素的给定名称的数据存储的值—通过 .data(name, value)HTML5 data-*属性设置。

$("div").data("k");//返回第一个div标签中保存的"k"的值

插件(了解即可)

jQuery.extend(object)

jQuery的命名空间下添加新的功能。多用于插件开发者向 jQuery 中添加新函数时使用。

示例:

<script>
jQuery.extend({
min:function(a, b){return a < b ? a : b;},
max:function(a, b){return a > b ? a : b;}
});
jQuery.min(2,3);// => 2
jQuery.max(4,5);// => 5
</script>

实践:

以上为给jQuery添加的方法。

以下为给jQuery对象添加的方法。

jQuery.fn.extend(object)

一个对象的内容合并到jQuery的原型,以提供新的jQuery实例方法。

<script>
jQuery.fn.extend({
check:function(){
return this.each(function(){this.checked =true;});
},
uncheck:function(){
return this.each(function(){this.checked =false;});
}
});
// jQuery对象可以使用新添加的check()方法了。
$("input[type='checkbox']").check();
</script>

实践:

单独写在文件中的扩展:

(function(jq){
jq.extend({
funcName:function(){
...
},
});
})(jQuery);

jQuery基础笔记 each和data(7)的更多相关文章

  1. jQuery基础笔记(1)

    day54 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html 1. 为什么要学jQuery?  MySQL Python              ...

  2. jquery基础 笔记一

    一. 1. vsdoc: 在Visual Studio中需要引入此版本的jquery类库才能启用智能感知.如:jquery-1.3.2-vsdoc2.js<body> <div id ...

  3. jQuery基础笔记 事件(6)

    day56 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-9-6 事件 *****         1. 目前为止学过的绑定 ...

  4. jQuery基础笔记(4)

    day55 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-9-3 文本操作 HTML代码: html()// 取得第一个匹配 ...

  5. jQuery基础笔记(3)

    day55 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-8-0 操作标签 样式操作 样式类 addClass();// 添 ...

  6. jQuery基础笔记(2)

    day54 筛选器 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-7-5 筛选器方法 下一个元素: $("#id& ...

  7. jquery基础 笔记三

    一. 操作"DOM属性" 在jQuery中没有包装操作"DOM属性"的函数, 因为使用javascript获取和设置"DOM属性"都很简单. ...

  8. jquery基础 笔记二

    动态创建元素 关于使用HTML DOM创建元素本文不做详细介绍, 下面举一个简单的例子: //使用Dom标准创建元素 var select = document.createElement(" ...

  9. Jquery基础笔记

    1.$(function(){               等价于     window.onload=function(){ })                               } 2 ...

随机推荐

  1. qstring转string

    Qt的QString功能丰富,对非英语语言的支持也不是问题,但支持得不够直接.例如,像 1 QString str("死亡使者赛维"); 这样直接用带中文的字符串进行构造,那么用Q ...

  2. window安装设置

    https://jingyan.baidu.com/article/73c3ce28ed7d92e50243d96c.html

  3. IE8以下支持css3 border-radius渲染方法

    这两天在做个集团网站,web前端妹子技术水平不咋样,写个web和wap 真够费劲的,对之前流行的H5和css3 响应式看来不太会用,扔给我一个半成品~~·非说各种canvas和border-radiu ...

  4. HRegionServer异常下线问题

    ==版本== Hadoop:2.7.1 HBase:1.2.1 Zookeeper:3.4.6 ==现象== HBase集群启动一段时间之后,一部分HRegionServer会异常下线重启(用syst ...

  5. DB2自增长ID

    建议类似的应用采用sequence对象,将来的应用维护和数据迁移会很方便.考虑的因素较少. 对于序列可以使用nextval和prevval来获得下一个和上一个值:CREATE SEQUENCE seq ...

  6. 2018.07.06 POJ1273 Drainage Ditches(最大流)

    Drainage Ditches Time Limit: 1000MS Memory Limit: 10000K Description Every time it rains on Farmer J ...

  7. xampp虚拟主机的配置

     ps:来源 https://blog.csdn.net/qq_17335153/article/details/52091869 一.修改httpd.conf   文件目录 xampp => ...

  8. 用org.mybatis.generator 生成代码

    1:引入pom 2:增加生成配置xml: <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE ...

  9. Caused by: org.hibernate.InvalidMappingException: Could not parse mapping document from resource Caused by: org.hibernate.DuplicateMappingException: duplicate import: Person refers to both cn.itcast.

    此错误是说有两个相同的名字的配置文件,所以不知道查找哪个.解决方法就是把不需要的那个配置文件删除. 删除mapping中不需要的那个xml文件即可

  10. faceswap安装说明

    Installing Faceswap Installing Faceswap Prerequisites Hardware Requirements Supported operating syst ...