• jQuery基础笔记 each和data(7)


    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);
    复制代码
  • 相关阅读:
    mTracker ----- MPDP
    读取UIM卡中的短信
    Your version is: java version "1.6.0_24". The correct version is: Java SE 1.6.
    [Java2 入门经典]第14章 集合框架
    [Java2 入门经典]第13章 泛型类
    [Java2 入门经典]第6章 类的扩展与继承
    彩信下载
    指标权重确定方法之熵权法
    用户价值分析
    数据归一化处理
  • 原文地址:https://www.cnblogs.com/112358nizhipeng/p/10246387.html
Copyright © 2020-2023  润新知