我們首先來介紹自定義選擇器的開發，他的代碼結構如下：
. 代碼如下:
(function ($) {
$.expr[':'].customselector = function (object,index,properties,list) {
//code
};
})(jQuery);
調用時候的寫法：
$(a:customselector) 現在我們先解釋下函數中所使用到的各個參數。
object：當前dom元素的引用，而不是jquery對象。需要強調的一點，dom元素和jquery對象完全不是一回事，a標簽代表的是dom元素，$('a')代表的是jquery對象，他本身是個js對象。不清楚的朋友情google相關知識。
index：下標為0的數組索引。
properties：選擇器元數據數組。
list：dom元素數組。
這些參數中，第一個參數是必須的，其他幾個參數是可選的。
選擇器函數通過bool值確定是否包含當前元素，true包含，false不包含。
這裡我們實現一個a標簽的選擇器，只選擇指向外部鏈接的a標簽，代碼如下：
. 代碼如下:
(function ($) {
$.expr[':'].external = function (object) {
if ($(object).is('a')) {
return object.hostname != location.hostname;
}
};
})(jQuery);
現在我們開始實現提示框插件的開發，開發過程就不多講了，主要是代碼實現，裡面有備注說明。
. 代碼如下:
(function ($) {//更新坐標位置
$.fn.updatePosition = function (event) {
return this.each(function () {
$(this).css({
left: event.pageX + 20,
top: event.pageY + 5
});
});
}
//提示框插件，將顯示a標簽title屬性的內容
$.fn.tooltip = function () {
return this.each(function () {
//獲取當前對象
var self = $(this);
//獲取title屬性值
var title = self.attr('title');
//判斷當前對象是否是a標簽，title屬性有無內容
if (self.is('a') && title != '') {
self.removeAttr('title')
.hover(function (event) {
//鼠標在目標對象上
$('<div id="tooltip"></div>').appendTo('body')
.text(title)
.hide()
.updatePosition(event)
.fadeIn(400);
}, function () {
//鼠標移出
$('#tooltip').remove();
}).mousemove(function (event) {
//鼠標移動
$('#tooltip').updatePosition(event);
});
}
});
};
})(jQuery);
希望本片文章對你有用，想看完整效果的朋友可以去下demo，下載地址：jQuery.plugin.tooltip