源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jQuery学习心得总结(必看篇)

  • 时间:2022-05-21 04:05 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jQuery学习心得总结(必看篇)
[b]jQuery 对象[/b] •jQuery 对象就是通过 jQuery 包装 DOM 对象后产生的对象。 •jQuery 对象是 jQuery 独有的。 •只有 jQuery 对象才能使用 jQuery 的方法,在 jQuery 对象中无法使用 DOM 对象的任何方法,反之 DOM 对象也无法使用任何 jQuery 的方法。 •约定:如果获取的是 jQuery 对象,那么要在变量前面加上 $ •jQuery 对象中封装了多个 DOM 对象,同时 jQuery 对象是类数组对象 [b]•数组与类数组对象的区别[/b] 1.数组的类型是Array 2.类数组对象的类型是 Object [b]DOM 对象转 jQuery 对象[/b] •使用 $()将 DOM 对象包装起来,就可以转换成 jQuery 对象
var item = document.getElementsByTagName('ul')[0], // DOM对象
  $item = $(item); // jQuery对象
[b]jQuery 对象转换为 DOM 对象[/b] jQuery 对象通过 jQuery 提供的 get(index)方法,得到对应的 DOM 对象
var $ul = $('ul'),
  ul = $ul.get(0);
jQuery 对象是一个类数组对象,可以通过 [] 方式,得到对应的 DOM 对象。 [b]类数组对象[/b] 类数组对象本质就是一个对象,只不过存储方式类似于数组的结构 •arguments 对象 ---- 接受函数实参的个数 •jQuery 对象 ---- 底层就是 dom 对象 [b]属性[/b] •length 属性(数组的长度 | 元素的个数) [b]方法[/b] •get(index):根据 index 放回对应的 dom 对象 •eq(index):根据 index 返回对应的 jQuery 对象 •index():查找元素的索引值 [b]ready 和 onlaod 的区别[/b] [b]ready[/b] 1.具有简写方式 2.在一个 HTML 页面中允许出现多个 3.加载完 DOM 结构就执行 4.执行速度快 [b]onload[/b] 1.没有简写方式 2.在一个 HTML 页面中只能使用一个 3.需要等页面所有资源加载完才执行 4.执行速度比 ready 慢 [b]jQuery 动画[/b] 基本隐藏、显示效果 •show()/ hide()
$('div').show(1000).hide(1000);
若是对同一个 jQuery 对象使用,可以采用链式操作。 滑动式动画效果 •slideDown()/ slideUp()
$('div').slideUp(1000).slideDown(1000);
淡入淡出 •fadeIn()淡入 •fadeOut()淡出
$('div').fadeIn(1000).fadeOut(1000);
并发和排队效果 •并发效果:设置多个动画同时执行 •排队效果:设置多个动画,按照先后顺序依次执行 [b]jQuery 插件 [/b] [b]jQuery 插件的作用[/b] •扩展 jQuery 的功能 •呈现组件化特点 [b]日期插件 - layDate插件[/b] •layDate初步使用 1.引入 laydate.js 2.laydate(options) [b]开发插件 [/b] [b]全局函数 [/b] 全局函数,实际上就是 jQuery 本身的方法。 jQuery 内置的一些功能是通过全局函数实现的。 •比如$.ajax()就是典型的全局函数 向 jQuery 命名空间添加一个函数,只需要将这个新函数指定为 jQuery 本身的一个属性
$.globalFunction = function(){
  // todo...
};
可以通过 jQuery.globalFunction()或者 $.globalFunction()来调用 当需要添加多个函数可以使用$.extend()函数
$.extend({
  functionOne: function(){
    // todo...
  },
  functionTwo: function(){
    // todo...
  }
});
通过上述代码可以添加全局函数,但是代码存在有关命名空间的风险 我们可以把属于一个插件的所有全局函数封装到一个对象
$.plugins = function(){
  functionOne: function(){
    // todo...
  },
  functionTwo: function(){
    // todo...
  }
};
通过上述代码,其实是为全局函数创建了另一个方法 --- plugins functionOne 和 functionTwo 已经成为 plugins 对象的属性。
$.plugins.functionOne();
$.plugins.functionTwo();
[b]添加 jQuery 实例对象的方法 [/b]
$.fn.method = function(){};对象方法的环境
在任何插件方法内部,关键字 this 引用的都是当前调用方法的 jQuery对象,因此可以在 this 上面调用任何内置的 jQuery 方法。 [b]方法连缀[/b] 通过 return this 来实现链式操作 以上这篇jQuery学习心得总结(必看篇)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程素材网。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部