zepto 基础知识(1)
1.$() 的用法。
获取元素
$('div') //获取所有页面中的div元素
$('#foo') // 获取ID 为"foo"的元素
创建元素
$("<p>Hellow</p>"") //新的p元素
$("<p/>",{text:"Hellow",id:"greeting",css:{color:'darkblue'}}) //<p id="greeting" 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)的更多相关文章
- zepto 基础知识(3)
41.height height() 类型:number height(value) 类型:self height(function(index,oldHeight){...}) 类型:self 获取 ...
- zepto 基础知识(6)
101.$.ajax $.ajax(options) 类型:XMLttpRequest 执行Ajax请求.他可能是本地资源,或者通过支持HTTP access control的浏览器 或者通过 JSO ...
- zepto 基础知识(5)
81.width width() 类型:number width(value) 类型:self width(function(index,oldWidth){....}) 类型:self 获取对象集合 ...
- zepto 基础知识(4)
61.prev prev() 类型:collection prev(selector) 类型:collection 获取对相集合中每一个元素的钱一个兄弟节点,通过选择器来进行过滤 62.prev pr ...
- zepto 基础知识(2)
20.append append(content) 类型:self 在每个匹配的元素末尾插入内容(内部插入).内容可以为html 字符串.dom节点,或者节点组成的数组. $('ul').append ...
- .NET面试题系列[1] - .NET框架基础知识(1)
很明显,CLS是CTS的一个子集,而且是最小的子集. - 张子阳 .NET框架基础知识(1) 参考资料: http://www.tracefact.net/CLR-and-Framework/DotN ...
- RabbitMQ基础知识
RabbitMQ基础知识 一.背景 RabbitMQ是一个由erlang开发的AMQP(Advanced Message Queue )的开源实现.AMQP 的出现其实也是应了广大人民群众的需求,虽然 ...
- Java基础知识(壹)
写在前面的话 这篇博客,是很早之前自己的学习Java基础知识的,所记录的内容,仅仅是当时学习的一个总结随笔.现在分享出来,希望能帮助大家,如有不足的,希望大家支出. 后续会继续分享基础知识手记.希望能 ...
- selenium自动化基础知识
什么是自动化测试? 自动化测试分为:功能自动化和性能自动化 功能自动化即使用计算机通过编码的方式来替代手工测试,完成一些重复性比较高的测试,解放测试人员的测试压力.同时,如果系统有不份模块更改后,只要 ...
随机推荐
- Java日志框架解析及实战分析
转载自: https://zhuanlan.zhihu.com/p/24272450 https://zhuanlan.zhihu.com/p/24275518 作为Java程序员,幸运的是,Java ...
- Android-视图绘制
http://blog.csdn.net/guolin_blog/article/details/16330267 任何一个视图都不可能凭空突然出现在屏幕上,它们都是要经过非常科学的绘制流程后才能显示 ...
- 【HTML5】HTML5 综合
HTML5教程: 视频教程:http://www.socss.cn/html5视频教程大集合/ DCloud关于HTML5:http://ask.dcloud.net.cn/docs 开发工具:HBu ...
- linux c开发: 在程序退出时进行处理
有时候,希望程序退出时能进行一些处理,比如保存状态,释放一些资源.c语言开发的linux程序,有可能正常退出(exit),有可能异常crash,而异常crash可能是响应了某信号的默认处理.这里总结一 ...
- spring学习(四)spring 持久层的封装
持久层:所谓“持久层”,也就是在系统逻辑层面上,专著于实现数据持久化的一个相对独立的领域(Domain),是把数据保存到可掉电式存储设备中.持久层是负责向(或者从)一个或者多个数据存储器中存储(或者获 ...
- pdf2swf 转换时报错。This file is too complex to render- SWF only supports 65536 shapes at once
在使用swftools转换pdf 到swf的时候报错,有如下说明:if the pdf contains too many images / shapes, pdf2swf will fail wit ...
- Oracle里删除重复记录,保留一项
我们在使用数据库的时候,有时数据会有所重复,当我们只需要一项数据时,不需要显示重复的记录时 如下就有SQL代码: --查找表中多余的重复记录,重复记录是根据单个字段来判断 select * from ...
- xtrabackup 备份恢复
XtraBackup物理备份 Percona XtraBackup是世界上唯一的开源,免费的MySQL热备份软件,为InnoDB和XtraDB 数据库执行非阻塞备份.使用Percona XtraBac ...
- 1.LVS理论基础
查看我的有道云笔记: http://note.youdao.com/noteshare?id=68e0ca45757943e482ba390d4d49369f&sub=4A2A593CDE2D ...
- 欢迎来到“火龙族智者”的blog
本blog里有每天更新的比赛感想,新技术体会以及日语学习相关事宜. 主要研究方向是算法,信息安全以及日语. 希望各位能常来看看.