根据这两天学习到的JQuery,我的初步认识就是JQuery是一个封装起来的对象,
里面用$()函数用原生js代码封装起来,并且返回一个JQuery对象,可以继续用打点的方法调用方法,调用方法作用于这个对象,还可以继续打.调用方法等等 解决了很大部分的兼容性问题,这些轮子对于编程有很大的简化作用。
这个我遇到的一个呼吸轮播在转换图片的时候,如果点击图片可能会有ref链接到的地址有混乱,这里面JQuery里面有fadeIn() fadeOut() fadeTo()fadeToggle()方法都内涵了这个方法解决了这个问题
因为呼吸轮播的起点是dispaly:block 到 dispaly:none 这个在js中是无法过渡的
所以在动画开始之前让新元素先dispaly block 然后瞬间再让opacity :0 然后在执行animate()函数然让新元素opacity变为1
接着让老元素 的动画结束的时候在回调函数中加入dispay none 这样操作就只会有一个元素有block 另外一个是none 这样就解决了问题
JQuery 中具有css()函数,这个函数单独修改一个样式的时候,直接“k”:v 就可以
加入有多个 就要用到JSON{}来描述
同事JQuery框架中有一个animate()函数 比我自己封装的好很多很多,功能和原先的animate2.0差不多,唯一有不同的地方在在用JQuery的运动函数的时候 如果同时操作同一个元素,运动是有序列的而不是同时进行的,假如操作不同元素的时候,这时候的运动是同时的。
关于批量添加监听 JQuery有很大的好处
因为再用原生JS给元素批量添加监听的时候,在用for循环批量添加的时候因为闭包的影响对象里的li【i】的i 对于for里面的变量i 不能记住自己的序号,所以必须要先给每一个对象添加一个自定义属性index 然后然后这个函数才可以记住的序号,用这个li【i】.index就可以输出自己的序号了 改变semaphore很关键 或者用IIEF也可以解决闭包的影响
在JQuery中几乎大部分都是批量的 都是批量添加的 只要用选择器选择,获取的都是一个类数组对象可以继续调用操作方法呀 什么的在轮播图中经常用到
$(this)
$(document)
$(window)
只有以上这3个元素不需要加引号 其他的都要加引号
$("p")
$(".box")
$("#box")
$("#box ul li")
$("li.special")
$("ol , ul")
$("*")
支持所有的选择器 直接可以根据像css写样式那样直接选择要想要操作的节点 很方便
$("p") 所有的p
$("p:first") 第一个p
$("p:last") 最后一个p
$("p:eq(3)") 下标为3的p eq()很特殊 可以拿出继续.调用里面可以用变量
$("p:lt(3)") 下标小于3的p
$("p:gt(3)") 下标大于3的p
$("p:odd") 下标是奇数的p odd基数 even偶数
$("p:even") 下标是偶数的p
以上的都是: 的一些筛选器 但是只有eq很特殊可以单独提炼出来当做方法调用
关于JQuery 的事件监听和我们平时的写法习惯很不一样
在原生JS中 我们写obj.onclick = function(){}这种写法
但是在JQuery中 $(“p).click(funtion(){})直接这样写 直接把事件函数当做方法被包装进去,里面的函数当做了回调函数就是在点击时触发 有一点异步的意思
$(“#box”)是jQuery对象,而不是JS原生对象。加[0]就能转为原生对象
JQuery对象加【index】就可以转化成原生对象用原生对象的写法
$()函数将返回一个对象队列,用eq来精确选择这个序列中的某个元素。到底eq几是这个元素呢?仰赖$()的序列是什么。同样的,lt、gt、odd、even、first、last都是这个机理。
Index()返还这个元素在亲兄弟中排名
Each()这个方法 就是会根据选择器选择到的所有元素 从0到最后一个一个的去遍历 然后括号中有回调函数 中 可以用$(this)指定一个一个元素要做什么 是同时的 但是可以加delay()让其延迟 就有一个一个一个冒出来的感觉 很cool
Size()方法和length属性一样 范围的都是一样的number
1 $("p").eq(2).html("哈哈哈哈哈哈"); |
等价于:
1 $("p").get(2).innerHTML = "哈哈哈哈哈哈"; |
等价于:
1 $("p").eq(2)[0].innerHTML = "哈哈哈哈哈哈"; |
Get()方法就是获取到元素,获取到的元素是原生对象 而不是JQuery对象了
关于运动的一些其他的方法
内置show()方法如果在括号里加一个时间就会变成一个动画 这是让一个元素本事是dispakynone 的属性可以 显示