zepto 基础知识(1)

摘要:
当回调返回false时停止遍历。此方法可用于所有Zepto对象。$地图;//=˃[4,9,16,25] $. 地图;//=˃[4,9]14.$.parseJSON$。parseJSON类型:对象本机JSON.par

1.$() 的用法。
  获取元素
    $('div') //获取所有页面中的div元素
    $('#foo') // 获取ID 为"foo"的元素
  创建元素

    $("<p>Hellow</p>"") //新的p元素
    $("<p/>",{text:"Hellow",id:"greeting",css:{color:'darkblue'}})    //<p   style="color:darkblue">Hellow</p>

  当页面ready的时候,执行回调:

   Zepto(function($){ 
      alert("123")
    })

2.camelCase

   将一组字符串变成“驼峰”命名法的新字符串,如果该字符串已经是驼峰命名,那么不变。

    $.camelCase('hello-there') //“helloThere”
    $.camelCass('helloThere') // "helloThere"

3.$.contains()

   检查父节点是否包含给定的dome 节点,如果两者是相同的节点,则返回 false.
  用法:$.contains(parent,node) 返回 boolean


4.each
  $.each(collection,function(indx,item){...})
  遍历数组元素或者以key-value 值对方式遍历对象。回调换上返回false 时停止遍历。

 $.each(['a','b','c'],function(index,item){ 
      console.log('item %d is: %s',index,item)
    }) 
      //item 0 is: a
      //ct1.html:18 item 1 is: b
      //ct1.html:18 item 2 is: c

  var hah = {name:'zepto.js',size:'micro'}
    $.each(hash,function(key,vaue){ 
      console.log('%s: %s',key,value)
    })
    //name: zepto.js
    //size: micro

5.$.extend
  $.extend(target,[source,[source2,...]])
  $.extend(true,target,[source,.....])
  通过源对象扩展目标对象的属性,源对象属性将覆盖目标对象属性
  默认情况下为,复制为浅拷贝,如果第一个参数为true表示深度拷贝(深度复制)

    var target = {one:'patridge'},
    source = {two:'turtle doves'}
    console.log($.extend(target,source))
    //{one: "patridge", two: "turtle doves"}

6.fn
  Zepto.fn 是一个对象,它拥有Zepto对象上所有的方法,在这个对象上添加一个方法。
  所有的Zepto 对象上都能用到这个方法。

   $.fn.empty = function(){
      return this.each(function(){ this.innerHTML=''})
    }

7.grep
  $.grep(items,function(item){...}) 类型array
    获取一个新数组,新数组只包含回调函数中返回true 的数组项

    $.grep([1,2,3],function(item){
      return item > 1
    );
      //=>[2,3]

8.inArray
  $.inArray(element,array,[fromIndex]) 类型:number
  返回数组中指定元素的索引值,如果没有找到该元素则返回 -1.
  [fromIndex] 参数可选,表示从哪个索引值开始向后搜索。

    $.inArray("abc",["bcd","abc","edf","aaa"]);
      //=>1
    $.inArray("abc",["bcd","abc","edf","aaa"],1);
      //=>1
    $.inArray("abc",["bcd","abc","edf","aaa"],2);
      //=>-1

9.isArray
  $.isArray(object) 类型:boolean
  如果object 是array ,则返回true.

    var ob = [1,2,3,4];
    console.log($.isArray(ob))
      //true

10.isFunction
  $.isFunction(object) 类型 boolean
  如果object 是function,则返回true.

    var fun = function(){ return 123;}
    console.log($.isFunction(fun))
      //true

11.$.isPlainObject
    $.isPlainObject(object) 类型:boolean
    测试对象是否是纯粹的对象,这个对象是通过对象常量("{}")或者new Object 创建的,如果是,则返回true.

      $.isPlainObject({}) 
        // => true
      $.isPlainObject(new Object) 
        // => true
      $.isPlainObject(new Date) 
        // => false
      $.isPlainObject(window) 
        // => false

12.isWindow
  $.isWindow(object) 类型;boolean
  如果object 参数是否为yige window 对象,那么返回true.这在处理iframe 时非常有用,因为每个iframe都有他自己的window对象,

  使用常规方法 obj=== window 验证这些objects时候会失败。


13.$.map
  $.map(collection,function(item,index){...}) 类型 collection
  通过遍历集合中的元素,返回通过迭代函数的全部结果,null和undefined 将被过滤掉。

 $.map([1,2,3,4,5],function(item,index){
    if(item>1){return item*item;}
  }); 
    // =>[4, 9, 16, 25]
  $.map({"yao":1,"tai":2,"yang":3},function(item,index){
    if(item>1){return item*item;}
  }); 
    // =>[4, 9]

14.$.parseJSON
    $.parseJSON(string) 类型:object
    原生 JSON.parse 方法的别名。接受一个标准格式的JSON 字符串,并返回解析后的JavaScript 对象。


15.trim
    $.trim(string) 类型: string
    删除字符串收尾的空白符,类型String.prototype.trim()


16.type
  $.type(object) 类型:string
  获取JavaScript 对象的类型,可能的类型有:null undefined boolean number string function array date regexp object error.
  对于其它对象,他只是简单报告为”object“,如果你想知道一个对象是否是一个javascript普通对象,使用isPlainObject.


17.add
  add(selector,[context]) 类型: self
  添加元素到当前匹配的元素集合中,如果给定content 参数,将只在content 元素中进行查找,否则在整个document 中查找。
  $('li').add('p').css('background-color', 'red');


18.addClass
  addClass(name) 类型:self
  addClass(function(index, oldClassName){....})
  为每个匹配的元素添加指定的class类名。多个class类名使用空格分隔。


19.after
  after(content) 类型 :self
  在每个匹配的元素后面插入内容(外部插入)内容可以为html字符串,dom节点,或者节点组成的数组。
  $.('form label').after('<p>A note below the label</p>')


20.append
  append(content) 类型:self
  在每个匹配的元素末尾插入内容(内部插入)。内容可以为html 字符串。dom节点,或者节点组成的数组。
  $('ul').append('<li>new list item</li>')

免责声明:文章转载自《zepto 基础知识(1)》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇成员函数对象类的const和非const成员函数的重载加布胡学QT笔记2下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

随便看看

Windows Server 2008 R2 备份与恢复详细实例

Windows ftp服务可以在百度内置,非常简单。)1.首先安装windows server 2008R2的备份功能。查找Windows的“服务器管理器”。下图显示了我的服务器的情况。双击它。备份完成后,我们卸载qq并删除磁盘F的数据。Linux服务器在没有密码的情况下构建Samba登录,并使用yum进行安装。...

zookeeper 日志输出到指定文件夹

最近,我在学习ZookeperStormKafka。顺便说一下,我在本地建立了一个集群。我遇到了Zookeeper日志输出路径的问题。我发现设置log4j。Zookeeper中的属性无法解决日志路径问题。我发现解决方案如下:1.修改log4j属性,您应该能够更改它。我更改了红色粗体,但仍然没有生效。#定义要移动的默认值...

流控制、FlowControl

作用就是防止网络拥堵时导致的“丢包”问题,大致的工作原理就是当链路两端的设备有一端忙不过来了,他会给另外一端的设备发一个暂停发包的命令,通过这种方式来缓解压力,解决丢包问题。看上去流控制应该是个非常好的防止丢包的方法,但是为什么我们还要在无盘上关闭他呢?...

Google Drive 里的文件下载的方法

Google Drive不提供创建直接下载链接的选项,但您可以通过更改链接形式在本地保存共享内容。例如,通过Google Drive共享的文件链接是:https://drive.google.com/file/d/FILE_ID/edit?usp=sharing如果您将其更改为以下修改版本,然后通过浏览器打开,则将直接下载该文件:https://drive....

浅谈JEECG多数据源的使用

首先,我们将简要介绍JEECG是什么。JEECG主张简单的功能由代码生成器直接生成,复杂的业务由表单定制,业务流程由工作流实现和扩展,开发人员编写特殊的业务逻辑。让我们重点讨论JEECG3.5GA中多个数据源的使用。JEECG3.5提供多个数据源的功能。JEECG多数据源的设计直接使用Springjdbc连接,独立于Hibernate、Mybatis和其他持...

菜鸟初学Linux——Ubuntu系统中,用root权限进行复制粘贴操作

longlongago,积累了一些Linux的小知识,拿出来分享一下,希望以后能够在工作上带来一些帮助。...