jQuery:怎么在页面和插件代码中自定义别名

jQuery:如何在页面和插件代码中自定义别名

众所周知，jQuery是采用$符号作为库的别名，但若是和其他类型的库一直使用是，其他库也有用$符号作为别名的，这样就会引起函数的冲突。所以更多的时间是建议大家使用jQuery来做为别名，或者自定义别名。该片文章重点地讲述了如何在页面代码和插件代码中自定义别名，以便于其他库的兼容，为之后的插件开发之旅铺垫道路！

1.在页面使用代码中如何自定义别名

通常，我们是这样开始jQuery库的使用的：

$(document).ready(function() {
	//一些代码
});
//或者是简写的方式：
$(function() {
	//一些代码
});

但是，若遇到了使用其他非jQuery库的情况，就需要对上面的代码进行改动了，所以兼容性不够好。比较好的方法是将$符号写全（jQuery）：

1
2
3

jQuery(function() {
	//一些代码
});

但是大家或许发现了，这样写的话，以后查找dom、或调用jQuery库中的函数，都需要写jQuery(‘p’)、jQuery.trim()。是否觉得比较麻烦，还是觉得$符号好用呢？

那么为你来介绍如何在页面代码中自定义别名的方法吧。格式如下：

jQuery(function(hiro) {
	//在内部我就可以这样使用,来弹出我当前使用浏览器的版本号
    alert(hiro.browser.version);
});

只需要在function中传入一个自定义的参数，该参数就是你的自定义别名了。该别名可以随意地自定义，当然可以使用$符号来自定义了，格式如下：

jQuery(function($) {
	//在内部我就可以这样使用,来弹出我当前使用浏览器的版本号
    alert($.browser.version);
});

这样使用的好处是，即使你在引入新的库后，也不会和新库产生冲突。

2.在插件代码中如何自定义别名

插件的实现原理就是将所有的插件代码都写在一个方法体内，然后执行即可。就像这样：

(function() {
  // 这里可以写插件的代码
  var xyz; // xyz 不是一个全局变量，他只在该方法体内可以获得
})(); // 该方法会立即执行（这里用到了匿名函数的概念）

这里多余的括号是必须的，因为你若不加括号的话，匿名函数就得不到执行。

那么在插件中自定义别名就很简单了，和在页面中自定义别名类似，格式如下：

(function($) {
  // 这里可以写插件的代码
  var xyz; // xyz 不是一个全局变量，他只在该方法体内可以获得
})(jQuery);

在上面的我给方法传入一个jQuery的参数，是因为该方法是对jQuery库的扩展，那么在该方法体内就可以调用jQuery库中的函数；若不传入，则无法调用jQuery库

一个小的插件编写技巧：

在我阅读国外的开发人员编写的插件时，发现很多的插件都会在代码的开始部分加上一个分号，格式如下：

;(function($) {
  // 这里可以写插件的代码
  var xyz; // xyz 不是一个全局变量，他只在该方法体内可以获得
})(jQuery);

我猜测这是因为很多的插件在代码的最前面会加上一些版权信息和使用方法的注释信息，加一个分号是为了防止注释结束遗忘吧，也告示着插件代码的开始！(个人猜测，仅供参考！)

具体的代码实现格式和运用可以阅读jQuery.tooltips.js的源代码，他的编写方式比较“正统”！

jQuery:怎么在页面和插件代码中自定义别名

1.在页面使用代码中如何自定义别名

2.在插件代码中如何自定义别名

一个小的插件编写技巧：

相关推荐