一、什么是 jQuery( 三 )


提高页面的运转概率 , 
七、参数规则:
css :CSS 选择器
: 特有的选择器
eg:
$('.wrapper ul li:eq(-1)')$('li[data^='Duyi']')$('li[data$='Duyi']')Null/Undefined:
Dom:原生 dom 对象
$(function(){}) $(document).ready()
两参数 css和执行期上下文
eg:
$('ul', 'wrapper')
( 选择器)
八、链式编程风格
// jQuery 的链式编程风格$('div').find('ul').addClass('menu').children().css('margin', 0).hide()// 以下是上述代码的分解描述$('div') // 返回一个匹配所有 div 元素的 jQuery 对象 .find('ul') // 返回匹配这些 div 元素中的所有后代 ul 元素的 jQuery 对象.addClass('menu') // 为这些 ul 元素添加 CSS 类名"menu" , 并返回当前对象本身.children() // 返回匹配这些 ul 元素中的所有子代元素的 jQuery 对象.css('margin', 0) // 为这些子代元素设置 css 样式"margin: 0" , 并返回当前对象本身.hide() // 隐藏这些子代元素 , 并返回当前对象本身
这种链式编程风格的实现机制 , 就是对象的所有实例方法 , 在没有特殊的返回需求的情况下 , 一般都会返回该对象本身(或者其它对象) , 因此我们可以继续调用返回的对象上的方法 。
$("#uid").val()、 $("div").attr("id")等方法在没有传入值参数时 , 它们将返回指定 DOM 元素的特定属性值 , 它们有特定的返回需求 , 因此无法进行链式编程 。如果是$("#uid").val("")、 $("div").attr("id", "myId")等情况 , 此时它们不需要返回特定的值 , 将返回当前本身 , 因此可用于链式编程 。
九、属性操作
的属性操作方法一览表
$('selector').val() // 获取第一个匹配元素的value值(一般用于表单控("selector").val("Hello"); // 设置所有匹配元素的value值为"Hello"$('selector').html() // 获取第一个匹配元素的innerHTML值$('selector').html('Hello') // 设置所有匹配元素的 innerHTML 值为"Hello"$('selector').text() // 获取第一个匹配元素的innerText值(jQuery已进行兼容处理) $("selector").text("Hello"); // 设置所有匹配元素的innerText值为"Hello"
.ready 和 . 的区别
window.onload = function () {document.getElementById('bg').style.backgroundColor = '#F90'}
第二节课选择元素相关方法 .get():获取指定原生的 dom 对象

一、什么是 jQuery

文章插图
一、什么是 jQuery

文章插图
$("img").get(0);//结果://[
一、什么是 jQuery

文章插图
一、什么是 jQuery

文章插图
一、什么是 jQuery

文章插图
一、什么是 jQuery

文章插图

// 我们使用data-src属性描述图片的真实路径 。//那么使用deferred来解决该用例的代码如下:$('#myBtn').firstClick(function () {var panel = $('#myPanel')var promises = []$('img', panel).each(function () {var image = $(this)var src = http://www.kingceram.com/post/element.data('src')if (src) {promises.push($.loadImage(src).then(function () {image.attr('src', src)},function () {image.attr('src', 'error.png')}))}})promises.push(panel.slideDown)$.when.apply(null, promises).done(function () {panel.fadeIn()})})