jQueryツールの機能

jquery は、配列やオブジェクトを操作するためのツール関数を提供し、それらの操作を容易にし、簡素化します。今日はjQueryのツール機能のレビューに入ります。

jQuery は、次の 5 つの主要なタイプのツール関数を提供します:

• URL

• StringOperation

• Array and Object Operation

• Test Operation

• ブラウザ

1

例:

var obj ={name:zh,age:20};

alert(jQuery.param(obj));

//alert "name=zh&age=20";

2: 文字列操作:

jQuery.trim(str)

戻り値: string;

説明: 文字列から先頭と末尾のスペースを削除します。

例:

alert($.trim(" 123 "));

//alert "123";

3: 配列とオブジェクトの操作:

(1) :

&.each(obj, callback)

説明:

オブジェクトと配列の反復に使用できる一般的な反復メソッド。

jQuery オブジェクトを反復処理する $().each() メソッドとは異なり、このメソッドは任意のオブジェクトを反復処理するために使用できます。

コールバック関数

には 2 つのパラメータがあります。1 つ目はオブジェクトのメンバーまたは配列のインデックスで、2 つ目は対応する変数またはコンテンツです。

各ループを終了する必要がある場合は、コールバック関数が false を返すようにすることができ、他の戻り値は無視されます。

例:

var a =[0,1,2,3,4,5];

$.each(a,function(i,n){document.write(""+i+" および " +n +"
");});

//結果:/*0 と 0

1 と 1

2 と 2

3 と 3

4 と 4

5 と 5I*/

(2):

$.extend(obj,default,option)


説明:

この関数は、オプションを処理するプラグインを開発するときに最も一般的に使用されます。

以下はファンシーボックスの仕組みです。プラグインはオプションを取得します。 コード:

settings = $.extend({}, $.fn.fancybox.defaults, settings);

上記のコードのターゲットは、デフォルト設定のデフォルトを最初のオブジェクトとして受け取り、ユーザーによって渡された設定をデフォルトにマージします。設定は渡されません。属性はデフォルト値のdefaultを使用します。その後、マージされた結果がターゲットにコピーされ、関数の戻り値として返されます。

完全な例を見てください。ターゲットの値は最後に変更されるため、ターゲット パラメーターは空のオブジェクトを渡す必要があります。 例:

var empty = {}
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = jQuery.extend(empty, defaults, options);

最終的な設定結果は同じですが、

の値はデフォルトを使用します。デフォルトが変更されました! プラグインのデフォルト値は修正されるはずです

target パラメータの使用法に注意してください。

(3): Filter

jQuery.grep( array, callback, [invert])

戻り値: Array

説明:

filter 関数を使用して、配列要素をフィルター処理します。

この関数は、フィルタリングされる配列とフィルタ関数という少なくとも 2 つのパラメータを渡します。フィルター関数は、要素を保持する場合は true を返すか、要素を削除する場合は false を返す必要があります。

説明:

デフォルトの invert は false です。つまり、invert を true に設定すると、フィルター関数は true を返して要素を削除します。

次の例は、それを示しています。 0 未満のインデックスを持つ配列をフィルターする方法 要素:

/*result：

//結果: [1,2]

(4). Conversion

jQuery.map( array, callback )

Return値:

Array

説明:

ある配列の要素を別の配列に変換します。

パラメータとしての変換関数は配列要素ごとに呼び出され、変換関数には変換される要素を表すパラメータが渡されます。 変換関数は、変換された値、null (配列から項目を削除)、または元の配列に展開された値を含む配列を返すことができます。

例: var arr = [ "a", "b", "c", "d", "e" ] ;

$("p").text(arr.join(", ") );arr = jQuery.map(arr, function(n, i){ return (n.toUpperCase() + i); });

$("p").text(arr.join(", "));

arr = jQuery.map(arr, function (a) { return a + a; });

alert(arr.join(", "));

//alert A0A0, B1B1, C2C2、D3D3、E4E4

(5)

jQuery.makeArray( obj ) 、

jQuery.inArray( value, array )

、

jQuery.merge( first, Second )

、

jQuery.unique (配列)

一つずつ紹介するつもりはありませんが、

とJavaScriptのjoin()メソッドとsplit()メソッドも非常に重要です。 4: テスト操作:

(1):$.isFunction(fn)Return: ブール値;

説明: 関数であるかどうかをテストします。例: var fn ( ){ };alert($.isFunction(fn));

//alert true;

(2):

$.isArray(obj);

Return: Boolean;

説明: 配列であるかどうかをテストします:

例: 省略;

(3):

JavaScript には isNan() と isFinite() のみがあります: 非数値と無限大;

5: ブラウザ オブジェクト:

jQuery の優れた点は、通常は必要ありません。ただし、jQuery 開発者またはプラグイン開発者は、ユーザーにクロスブラウザー機能を提供するために、ブラウザーの違いを自分で処理する必要があります。

ブラウザ機能を取得するためのプロパティ:

jQuery.support	バージョン 1.3 以降の新機能
jQuery.browser	非推奨
jQuery.browser.version	繰り返し
jQuery.boxModel	非推奨

$.support:

jQuery 1.3 新しい。さまざまなブラウザの機能とバグを表示するために使用されるプロパティのセット。

jQuery は一連の属性を提供しており、独自の属性を自由に追加することもできます。これらのプロパティの多くは非常に低レベルであるため、時間が経っても効果が持続するかどうかを言うのは困難ですが、これらは主にプラグインおよびカーネル開発者を対象としています。

これらのサポートされている属性値はすべて、ブラウザーの検出ではなく、機能の検出によって実装されます。これらの機能検出がどのように機能するかを説明する優れたリソースをいくつか紹介します:

• http://peter.michaux.ca/articles/feature-detection-state-of-the-art-browser-scripting

• http:/ /yura.thinkweb2.com/cft/

• http://www.jibbering.com/faq/faq_notes/not_browser_detect.html

jQuery.support には主に次のテストが含まれています:

boxModel: Equalsこのページとブラウザが W3C CSS ボックス モデルを使用してレンダリングされる場合は true。通常、IE 6 および IE 7 の Quirk モードでは、この値は false です。ドキュメントの準備ができるまで、この値は null です。

cssFloat: CSS の float 値にアクセスするために cssFloat が使用される場合は true を返します。現在、IE では false が返され、代わりに styleFloat が使用されます。

hrefNormalized: ブラウザーが getAttribute("href") からそのままの結果を返す場合は true を返します。 IE では、URL が正規化されているため、false が返されます。

htmlSerialize: innerHTML を通じてリンク要素を挿入するときにブラウザーがこれらのリンクをシリアル化する場合、現在、IE は false を返します。

leadingWhitespace: innerHTML を使用するときにブラウザーが先頭の空白文字を保持する場合は true を返します。現在、IE 6 ～ 8 では false を返します。

noCloneEvent: 要素のクローン作成時にブラウザが イベント処理 関数と一緒に要素をコピーしない場合は true を返します。 現在、IE では false を返します。

objectAll: 要素オブジェクトに対して getElementsByTagName("*") を実行すると、すべての子孫要素が返される場合は true、IE 7 では現在 false。

opacity: ブラウザーが透明度スタイル属性を適切に解釈できる場合は true を返します。現在、IE では代わりにアルファ フィルターが使用されるため、false を返します。

scriptEval: appendChild/createTextNode メソッドを使用してスクリプト コードを挿入するときにブラウザーがスクリプトを実行するかどうか。現在、IE では .text メソッドを使用して実行用のスクリプト コードを挿入します。

style: getAttribute("style") が要素のインライン スタイルを返す場合は true。現在、IE では代わりに cssText が使用されるため、これは false です。

tbody: ブラウザがテーブル要素に tbody 要素を含めないことを許可している場合は true を返します。現在、IE では false が返され、不足している tbody が自動的に挿入されます。

このブログに同様の記事がありますので、参照してください: 私の jQuery シリーズの目次まとめ

以上がjQueryツールの機能の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。