一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

jquery第一阶段学习笔记

时间:2013-12-10 编辑:简简单单 来源:一聚教程网

function采用new来实例化,而this就是实例的一个引用,所谓引用,有点类似人的别名,无论别名有多少,都指的是同一个人,所以this指的是那个用new创建的实例,this是运行时确定的,所以同一个this可能指向不同的对象。

讲到this就不得不谈JS的类型,JS只有几种类型,分别是string,number,function,object和boolen。其中最灵活的是object类。

例如o={};

 代码如下 复制代码

o=[];

a=function(){};

o=new a();

这三种情况,o都是object类,甚至NULL也是object类,不过NULL是空,没有对象。如果是下面这种情况,this指向window:

 代码如下 复制代码

a=function(){

alert(this);

}

this的另一种用法是指向function类型,例如

 代码如下 复制代码

a=function(){

}

a.b=function(){

alert(typeof this)

}

这种写法有点特殊,不过他有特殊的用途,结合apply,call可以写成,this.call或this.apply的形式,此时会调用this指向的函数,可以实现一些特殊的效果。

补充一些内容

1、基本语法:
   $(selector).action()
   $:定义jQuery
   selector:选择符,查询和查找HTML元素
   action():对元素执行的操作
   实例:
   $(this).hide()------隐藏当前元素
   $("p"),hide()-------隐藏所有的p元素
   $("#ID").hide()-----隐藏id=ID的元素
   $("p.Class")--------隐藏class=Class的P

   $(document).ready(function(){-----});
   这样用为了防止文档未加载就运行jQuery代码。
2、选择器通过属性选择元素
   $("[href]") 选择所有具有href属性的元素
   $("[href='AA']") 选择属性href=‘AA’的元素
   $("[href!='AA']")选择所有href!=‘AA’的元素
   $("[href$='.jpg']")选取所有href值以.jpg结尾的元素
3、选择器选择Css属性
   $("p").css("background-color","red"); 修改所有的p元素的背景颜色为红色
   $("div#ID .Class") id=ID的div元素中所有class=Class的元素
4、名称冲突
   var jQMy = jQuery.noConflict() yong jQMy代替$
5、常用事件
   $(document).ready(function) 文档的就绪事件
   $(selector).click(function) 被选元素的点击事件
   $(selector).dblclick(function) 被选元素的双击事件
   $(selector).focus(function)    被选元素获得焦点事件
   $(selector).mouseover(function) 被选元素鼠标悬停事件
6、jQuery效果
   $(selector).hide() 隐藏被选元素
   $(selector).show() 显示被选元素
   $(selector).toggle() 切换(在隐藏与显示之间)被选元素
   $(selector).slideDown() 向下滑动(显示)被选元素
   $(selector).slideUp() 向上滑动(隐藏)被选元素
   $(selector).slideToggle() 对被选元素切换向上滑动和向下滑动
   $(selector).fadeIn() 淡入被选元素
   $(selector).fadeOut() 淡出被选元素
   $(selector).fadeTo() 把被选元素淡出为给定的不透明度
   $(selector).animate() 对被选元素执行自定义动画
   参数:"slow", "fast", "normal" 或毫秒
   回调函数:callback
   $("p").hide(1000,function(){
   alert("The paragraph is now hidden");
   });
7、jQuery的HTML操作
   $(selector).html(content) 改变被选元素的(内部)HTML
   $(selector).append(content) 向被选元素的(内部)HTML 追加内容
   $(selector).prepend(content) 向被选元素的(内部)HTML “预置”(Prepend)内容
   $(selector).after(content) 在被选元素之后添加 HTML
   $(selector).before(content) 在被选元素之前添加 HTML
8、jQuery的CSS操作
   $(selector).css(name,value) 为匹配元素设置样式属性的值
   $(selector).css({properties}) 为匹配元素设置多个样式属性
   $(selector).css(name) 获得第一个匹配元素的样式属性值
   $(selector).height(value) 设置匹配元素的高度
   $(selector).width(value) 设置匹配元素的宽度
9、jQuery AJAX 请求
   $(selector).load(url,data,callback) 把远程数据加载到被选的元素中
   $.ajax(options) 把远程数据加载到 XMLHttpRequest 对象中
   $.get(url,data,callback,type) 使用 HTTP GET 来加载远程数据
   $.post(url,data,callback,type) 使用 HTTP POST 来加载远程数据
   $.getJSON(url,data,callback) 使用 HTTP GET 来加载远程 JSON 数据
   $.getScript(url,callback) 加载并执行远程的 JavaScript 文件
   (selector) jQuery 元素选择器语法
   (url) 被加载的数据的 URL(地址)
   (data) 发送到服务器的数据的键/值对象
   (callback) 当数据被加载时,所执行的函数
   (type) 被返回的数据的类型 (html,xml,json,jasonp,script,text)
   (options) 完整 AJAX 请求的所有键/值对选项

热门栏目