Tip16：JS的定時器

　　JS 中有兩種定時器，setTimeout('fn', t) 和 setInterval('fn', t)，'fn'指的是定時執行的方法名，字符串類型。

?

?

?

　　setTimeout('fn', t)：

?

只執行一次，執行完成后將銷毀。

?

　　setInterval('fn', t)：一直執行。

?

(Date：2012-02-17)

?

-----------------------------------------------------------------

Tip15：Jquery觸發回車事件

$(function () {
$('#target').bind('keyup', function (event) {
if (event.keyCode == 13) {
alert("Hello~");
}
});
});

(Date：2011-10-28)

-----------------------------------------------------------------

?Tip14：獲得select 的值

　　jquery可以像獲取textbox值一樣獲取select的值：$('select').val();

(Date：2011-10-19)

-----------------------------------------------------------------

Tip13：復制文本

　　使用 ?window.clipboardData.setData('text', text); 可以將text文本放到系統剪貼板中，實現文本的復制功能。但是，這個方法只被IE所支持。Google Chrome 和Foxfire都不支持。所以，在使用時應先判斷瀏覽器是否支持：if (window.clipboardData) {?

?

window.clipboardData.setData('text', text);?}

(Date：2011-9-16)

-----------------------------------------------------------------

Tip12：選擇文本

　　對于input或者textarea的文本選擇，jquery提供了一個簡單的函數完成：select()，在調用它的時候，需要確保文本框可見，并且已經獲得焦點。

?

?

?

　　$("#txtSample").focus().select();　　//現貨的焦點，然后選擇文本

(Date：2011-9-16)

-----------------------------------------------------------------

Tip11：鼠標事件

　　mouseover 和 mouseout、

?

mouseenter 和 ?mouseleave；這兩組事件都是鼠標移入和移出元素時觸發的，他們的最大區別是：

?

mouseover 和 mouseout是冒泡的，如果鼠標移動到它們的子元素，同樣會觸發該事件，而

?

mouseenter 和 ?mouseleave是不會冒泡的。

?

?

?

　　這個區別很重要！

(Date：2011-9-14)

-----------------------------------------------------------------

Tip10：頁面跳轉

使用js直接對window.location.href 賦一個URL字符串值即可實現跳轉。

window.location.href = 'a.html';

(Date：2011-6-18)

-----------------------------------------------------------------

Tip9：jQuery對象的擴展

$.extend(target,prop1,propN)：用一個或多個其他對象來擴展一個對象，返回這個被擴展的對象。這是jquery實現的繼承方式。例如：
$.extend(settings, options);
合并settings和options，并將合并結果返回settings中，相當于options繼承setting并將繼承結果保存在 setting中。
var settings = $.extend({}, defaults, options);
合并defaults和options，并將合并結果返回到setting中而不覆蓋default內容。可以有多個參數（合并多項并返回）

(Date：2011-6-18)

-----------------------------------------------------------------

Tip8：jQuery刪除數組中的項

如Tip7中所說，使用$.grep()方法刪除數組中的元素。

var?array?=?['a',?'b',?'c'];?
$.grap(array,?function(value, index){return?value=='b';},?true);

上面的代碼將刪除數組array中的元素'b'。

(Date：2011-6-18)

-----------------------------------------------------------------

Tip7：jQuery數組的處理

$.each(obj, fn);

　　對obj進行遍歷，obj為要遍歷的數組或對象；fn為處理函數，可選的參數為索引和內容，例如var fn = function(index, content){}；如果需要結束遍歷，請返回false，其它的返回值將會被忽略。

　　該方法可以用來處理JSON數據對象。

$.inArray(obj, array);

　　判斷數組array中是否包含obj對象，如果存在，返回對應的下標，如果不存在，返回-1；

$.map(array, fn);

　　將一個數組中的元素轉換到另一個數組中。array為需要轉換的數組，fn為處理函數；這個方法的返回值是一個經過處理后的新數組。

$.merge(array1, array2);

　　合并兩個數組；將數組array2中的內容復制到array1中，并將結果返回。merge方法不會去除重復，需要使用 $.unique()去除重復。

$.unique(array);

　　去除數組array中的重復項。

$.grep(array, fn, [invert]);

　　過濾數組中的元素；該方法對數組array中的每一個對象都調用fn方法；

　　invert 可選參數；如果 "invert" 為 false 或未設置，則函數返回數組中由過濾函數返回 true 的元素，當"invert" 為 true，則返回過濾函數中返回 false 的元素集。

　　該方法常用來刪除數組中的元素

(Date：2011-6-18)

-----------------------------------------------------------------

Tip6：去除string開頭和結尾的空格

js中沒有提供trim函數供我們去掉字符串兩段的空字符，jQuery中擴展了這一功能：

$.trim(str)：刪除字符串兩端的空白字符。
如：$.trim(" hello, how are you? "); //返回"hello,how are you? "

(Date：2011-6-18)

-----------------------------------------------------------------

Tip5：添加事件和移除事件

為一個jQuery對象添加事件是很方便的事情：

$('#btn').click(fn);

$('#btn').bind('click', fn);

jQuery提供了為一個對象的事件提供多個處理函數的機制，我們添加了一個click事件處理方法后，還可以繼續添加，而不會覆蓋先前的處理方法。

當調用unbind方法時移除綁定的事件訂閱：

$('#btn').unbind();　　　　//將會移除所有的事件訂閱

$('#btn').unbind('click')　　//將會移除click事件的訂閱

(Date：2011-6-18)

-----------------------------------------------------------------

Tip4：擴展需要的功能

jQuery提供了extend方法讓我們來擴展自己需要的功能。例如：

$.extend({
sum: function(num1, num2){return num1+num2; },
}); //為jquery擴展了sum方法

使用擴展的方法（通過“$.方法名”調用）：
alert($.sum(10, 20));

(Date：2011-6-18)

-----------------------------------------------------------------

Tip3：獲取jQuery對象集合中的一項

　　對于獲取的元素集合，獲取其中的某一項（通過索引指定）可以使用eq或get(n)方法或者索引號獲取，要注意，eq返回的是jquery對象，而 get(n)和索引返回的是dom元素對象。對于jquery對象只能使用jquery的方法，而dom對象只能使用dom的方法，如要獲取第三個<div>元素的內容。有如下兩種方法：
$("div").eq(2).html(); 　　　　 //調用jquery對象的方法
$("div").get(2).innerHTML; 　　//調用dom的方法屬性

(Date：2011-6-18)

-----------------------------------------------------------------

Tip2：jQuery對象和Dom的轉換

Dom對象可以通過$(dom)轉換為jQuery對象；例如：

　　$(document.getElementById('#myDiv'))

jQuery對象本身是一個索引，可以通過下標得到Dom對象；也可以使用方法get()獲取Dom對象；例如：

　　$("div")[0];　　　　//獲取第一個Dom對象

　　$("div").get(0);　　//同樣獲取第一個Dom對象

(Date：2011-6-18)

-----------------------------------------------------------------

Tip1：在獨立的js文件中智能感知

在js文件的開頭添加：/// <reference path="jquery-1.3.2-vsdoc2.js"?/>

(Date：2011-6-16)

-----------------------------------------------------------------

參考目錄：

JQuery從零開始系列教程：

從零開始學習jQuery (一) 開天辟地入門篇

從零開始學習jQuery (二) 萬能的選擇器

從零開始學習jQuery (三) 管理jQuery包裝集

從零開始學習jQuery (四) 使用jQuery操作元素的屬性與樣式

從零開始學習jQuery (五) 事件與事件對象

從零開始學習jQuery (六) jQuery中的Ajax

從零開始學習jQuery (七) jQuery動畫-讓頁面動起來!

從零開始學習jQuery (八) 插播:jQuery實施方案

從零開始學習jQuery (九) jQuery工具函數

從零開始學習jQuery (十) jQueryUI常用功能實戰

從零開始學習jQuery (十一) 實戰表單驗證與自動完成提示插件

JQuery小技巧：

http://blog.csdn.net/gudanyehai/archive/2010/04/29/5541187.aspx

本文轉自齊師傅博客園博客，原文鏈接：http://www.cnblogs.com/youring2/archive/2011/06/16/JavaScriptTips.html，如需轉載請自行聯系原作者

總結

以上是生活随笔為你收集整理的js、jquery实用小技巧集合的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。