JavaScript中this和$(this)之间的区别以及extend的使用
jQuery中this和$(this)之间的区别:
this返回的是当前对象的html对象,而$(this)返回的是当前对象的jQuery对象
举个正确的Demo实例:
$("#textbox").hover(
function() {
this.title = "Test";
},
fucntion() {
this.title = "OK”;
}
);
以上的this为html元素即元素textbox,该元素有title属性,因此以上的程序没有错误。如果将以上的程序中this替换成$(this)时,该程序就会报错,因为$(this)返回的是一个jQuery对象,而jQuery对象是没有title这些属性的,而$(this)中有方法可以对html元素中title属性进行设置和修改。代码如下:
$("#textbox").hover(
function() {
$(this).attr('title', 'Test');
},
fucntion() {
$(this).attr('title', 'OK');
}
);
使用jQuery的好处是它包裝了各种浏览器版本对DOM对象的操作,因此统一使用$(this)而不再用this应该是比较不错的选择。
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。如扩展$.fn.test(),即$.fn.test()是对jquery扩展了一个test方法,那么后面你的每一个jquery实例都可以引用这个方法了。
jQuery为开发插件提拱了两个方法,分别是:jQuery.extend(object):为扩展jQuery类本身.为类添加新的方法和jQuery.fn.extend(object):给jQuery对象添加方法。
也就是说jQuery.extend(object)相当于扩展静态的方法,而jQuery.fn.extend(object)相当于扩展非静态的成员方法。
jQuery.extend(object)Demo实例代码如下:
$.extend({
add:function(a,b){returna+b;}
});
使用方法如下:$.add(3,4); //return 7
jQuery.extend()方法也可以用作合并对象,在合并对象时,第一个参数代表是否需要深合并。使用的原型为:jQuery.extend(bool,destObj,sourceObj)
jQuery.extend(bool,destObj,sourceObj1,sourceObj2,...)Demo实例代码如下:
var destObj={
name: "destname",
location: {
city: "destcicty",
county:"destcountry"
}
}; var sourceObj={
name: "sourcename1",
location: {
city: "soucecity1",
county:"sourcecountry1"
}
}; var sourceObj2={
name: "sourcename2",
location: {
city: "soucecity2",
county:"sourcecountry2"
}
}; var result=$.extend(true,destObj,sourceObj1,sourceObj2); //result=var sourceObj={ name: "sourcename2", location: {city: "soucecity2",county:"sourcecountry2"} }
jQuery.fn.extend(object)是对jQuery.prototype进得扩展,jQuery类的实例可以使用这个“成员函数”。 Demo实例代码如下:
$.fn.extend({
alertWhileClick: function(){
$(this).click(function(){
alert($(this).val());
});
}
});
JavaScript中this和$(this)之间的区别以及extend的使用的更多相关文章
- JavaScript中object和Object有什么区别
JavaScript中object和Object有什么区别,为什么用typeof检测对象,返回object,而用instanceof 必须要接Object呢 ————————————————————— ...
- JavaScript中const、var和let区别浅析
在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...
- JavaScript中值类型和引用类型的区别
JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不 ...
- JavaScript中=、==、===以及!=、!==的区别与联系
JavaScript中=.==.===以及!=.!==的区别与联系 在JavaScript中,“=”代表赋值操作:“==”先转换类型再比较,“===”先判断类型,如果不是同一类型直接为false. ...
- [转] C#中out和ref之间的区别
gskcc 的原文地址 C#中out和ref之间的区别 首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:ref可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个 ...
- javaScript中的querySelector()与querySelectorAll()的区别
之前,在JavaScript获取文档元素一文中,我曾介绍了获取文档元素的几种方法,最后一种方法是通过选择器获取文档元素.它的核心思想便是利用querySelector()或querySelectorA ...
- 深入理解Javascript中构造函数和原型对象的区别
在 Javascript中prototype属性的详解 这篇文章中,详细介绍了构造函数的缺点以及原型(prototype),原型链(prototype chain),构造函数(constructor) ...
- 关于javascript中apply()和call()方法的区别
如果没接触过动态语言,以编译型语言的思维方式去理解javaScript将会有种神奇而怪异的感觉,因为意识上往往不可能的事偏偏就发生了,甚至觉得不可理喻.如果在学JavaScript这自由而变幻无穷的语 ...
- iOS 中 #import同@class之间的区别
很多刚开始学习iOS开发的同学可能在看别人的代码的时候会发现有部分#import操作写在m文件中,而h文件仅仅使用@class进行声明,不禁纳闷起来,为什么不直接把#import放到h文件中呢? 这是 ...
随机推荐
- [问题2014S05] 解答
[问题2014S05] 解答 (本解答由谷嵘同学提供) 首先, 由 \(\mathrm{tr}(AB)=\mathrm{tr}(BA)\) 可得 \(a=0\), 或者由 Cauchy-Binet ...
- 查看SQL SERVER数据库运行参数和连接数
---查看当前数据库系统所有请求情况.我只列出了我认为比较重要有助于我解决问题的字段. SELECT ds.session_id, ds.status, Db_name(dr.database_id) ...
- Android安全研究经验谈
安全研究做什么 从攻击角度举例,可以是:对某个模块进行漏洞挖掘的方法,对某个漏洞进行利用的技术,通过逆向工程破解程序.解密数据,对系统或应用进行感染.劫持等破坏安全性的攻击技术等. 而防御上则是:查杀 ...
- 405 Method Not Allowed
今天在发布一个网站的时候遇到 标题上的问题,一直不明白是为何,刚开始以为是我的程序写的有问题,随即将项目发给同事来发布试试,在他的IIS上发布却没出现问题,一切正常,这可就怪了,于是想到了应该是IIS ...
- 20个Linux服务器安全强化建议(三)
#11.配置iptables和TCPWrappers. iptables 是一个Linux内核提供的,运行在用户空间的程序,它允许用户配置自己的防火墙策略.我们可以使用防火墙将不必要的流量过滤出去 ...
- 《BI那点儿事》ETL中的关键技术
ETL(Extract/Transformation/Load)是BI/DW的核心和灵魂,按照统一的规则集成并提高数据的价值,是负责完成数据从数据源向目标数据仓库转化的过程,是实施数据仓库的重要步骤. ...
- vim 简单配置
在启动vim时,当前用户根目录下的.vimrc 文件会被自动读取,该文件可以包含一些设置甚至脚本,所以,一般情况下把.vimrc 文件创建在当前用户的根目录下比较方便,即:$vi ~/.vimrc,然 ...
- (41) Aeroo 模板设计基础教程
1. 理论基础 注:我采用libreoffice5.2设计讲解 1.1. 定义模板指令 模板指令的语法和Genshi 模板语言相兼容,可以用Libreoffice( Write, Ca ...
- WPF:ListView 分页
布局MainWindow.xaml <ListView Name="list_Reg" ItemsSource="{Binding Source={StaticRe ...
- 回车键转tab键
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head ...