48jQuery関連

含む問題はJQuery源:モジュールプロセス2、新たな構築物、3、深いクローン
A、断片的知識のjQuery
オブジェクトに1、JS jQueryオブジェクト(1)の$ DIV [0] ;(2)$ div.get (0);
2、依然としてjQueryオブジェクトを取得div.eqの$(0)(1);
3、JS jQueryオブジェクトの$(DIV)に物体
6は、検索()DOMツリーの下のすべてのレベルを横断
7、下向きのDOMツリートラバーサル単一レベルに沿った子()。
8、HTML、プロペラを用いた処理方法と素子自体の固有の特性。
9、私たち自身のカスタムHTML要素のDOMプロパティ、および取り扱いで、attrにメソッドを使用して
小道具を使用して、チェックを選択したり無効にしたりなどの2つの属性の真と偽性を有する、10()
。11、$(この).ATTR (this.checked、 "確認"!) ;(1)$(これは) ATTRメソッドを持っている(2)これは、属性チェックした

2、jQueryのソースライブラリ総読書
`` `のJavaScript
(機能(グローバル、工場){
」を使用します厳密";
IF(typeof演算Module1を==="オブジェクト"&& typeof演算module.exportsは==="オブジェクト「){

module.exportsは= global.document?
ファクトリー(真のグローバル、):
機能(W){
{IF(w.document!)
スロー新しい新しいError( "jQueryのザ・必要となる文書Aとウィンドウ");
}
ファクトリー(W)を返す;
};
}他{
工場(グローバル);
}
})(typeof演算窓==「未定義」ウィンドウが:!?この/ *最初の1つの引数:、窓があった、任意のウィンドウオブジェクトが存在するかどうかを判断するための動作環境ではありません、この* /、機能(窓、NOGLOBAL){} / * 2番目の引数* /);
`
ノード環境で、およびNPMを介してjqueryのVaRのAAAをインストール=( "jqueryの"必要 )(ウィンドウ)、 AAAによってjQueryライブラリの導入。呼び出します。このコードは以下の状況の治療のために調製される:
1、オペレーティング環境は、ウィンドウオブジェクト、渡している(ウィンドウ、工場の)
(1)module.exportsはモジュールオブジェクトとオブジェクトを持っています、
、=工場module.exportsは(ウィンドウは、trueに)実行し、オブジェクトがwindow.document
B、ないwindow.document目的=機能がmodule.exportsは(W)を実行} {
(2)とオブジェクトモジュールmodule.exportsはオブジェクトではありません一般場合にプログラマのフロントエンドに使用される工場(窓)、実行
2、窓なしオブジェクトの動作環境、渡され(この、工場)
(1)とオブジェクトモジュールmodule.exportsはオブジェクトた
、オブジェクトはthis.documentを有します=工場(これは、trueに)module.exportsは行わ
B、ないthis.documentオブジェクトは=機能が実行module.exportsは(W)} {
(2)とオブジェクトモジュールmodule.exportsはないオブジェクト実行工場ない(本)

3、jQueryの非新しい構築物(セクション3)の例
`` `のJavaScript
VAR = aquery関数(セレクタ、コンテキスト){
戻り新しいAQuery.prototype.init()
;}
AQuery.prototypeが= {
関数(){:INIT
this.attributeA = "attribute1の";
これを返す; / * ???:必要*この戻り/存在しないinitの後、新しいので
}、
関数(){:methodA
; this.attributeB = "attribute2の"
/ *、連鎖コールのように、このリターン*これは、このリターン/なければならない
}、
attributeC: "Attribute3を"
};
AQuery.prototype.init.prototype AQuery.prototype =
`
アイデア:
(1)jQueryのは、新しいプロトタイプinitメソッドを実行したとき、
(2) initメソッド向けjQueryのプロトタイププロトタイプ
(4)ソース:HTTPS://segmentfault.com/a/1190000003501504

4つ、ソース方法を拡張
`` `のJavaScript
//jQuery.extend({myFunction:function(){}})。
//jQuery.extend(true,{myFunction:function(){}})
//jQuery.extend({myObject:[1,2,3,4,5,{a:1,b:[6,7、8,9,0]}]})。
//jQuery.extend(true,{myObject:[1,2,3,4,5,{a:1,b:[6,7,8,9,0]}]})。
jQuery.extend = jQuery.fn.extend =関数(){
VARのSRC、copyIsArray、コピー、名前、オプション、クローン、
目標=引数[0] || {}、
i = 1、
長さ= arguments.lengthを、
深い= FALSE;
//ディープコピー状況をハンドル
(typeof演算ターゲット===「ブール」){場合
、深い=ターゲット。
目標=引数[1] || {};
//ブール値と目標スキップ
I = 2;
}
//ハンドルケースターゲットは(深いコピーでも可)、文字列か何かのとき
(typeof演算ターゲット== "オブジェクト" && jQuery.isFunction(ターゲット)!!)場合は{
ターゲット= {};
}
唯一の引数が渡された場合// jQueryの自体を拡張
(長さ=== I){場合
、ターゲット=この;
- 私;
}
のための(; iは長さ<; iは++){
//唯一の非ヌル/未定義の値を扱う
((オプション=引数[I])!= NULL){場合
//ベースオブジェクト拡張
(オプション名)のために{
SRC =ターゲット[名]。
コピー=オプション[名前]。
//防止は終わりのないループ
//假如出现如下情形
//ターゲット= {名:A}。
//コピー=;
IF(ターゲット===コピー){//コンテンツをコピーして、そのような$ .extendように、スキップサイクルなどのオブジェクト、(真、{名前を拡張した場合: 5}、{名:{名前:5} });
続行;
}
// WEが配列オブジェクト又はている場合は普通は再帰マージ
IF(深いコピー&& &&(jQuery.isPlainObject(コピー)||(copyIsArray = jQuery.isArray(コピー)))){
IF(copyIsArray) {
copyIsArray = falseに、
SRC = && jQuery.isArray(SRC)SRC:?[]クローン;
} {他の
/*$.fn.extend(true,{a:{b:{c:1}}});*を/
にconsole.log(SRC); //未定義
?= SRC && jQuery.isPlainObjectクローン(SRC)SRC:{};
にconsole.log(クローン); // {B:{C :. 1}}
/ *質問:クローン=未定義のいずれか、またはクローン= {}。なぜクローン= {B:{C: 1}} 、それ?
説明:最後の行ではない再帰値コード、srcおよびクローン操作は、それぞれ別の場所で* /割り当てられ
}
それらのクローン、決して元のオブジェクトを移動//
ターゲット[名] = jQuery.extend(ディープ、クローン、コピー) ; / *
$の.fn.extend(trueに、{:B {{C:1}}});を実行する
1クローン
この[A] = jQuery.extend(深い 、{}、{B: {C:1}});即ち
this.a = jQuery.extend(深い、{} 、{B:{C:1}});
2クローン
{} [B] = jQuery.extend(深い、{}、{C:1}); 即ち、
{B:jQuery.extend(深い、{ }、{C:1})}; オブジェクトこれに割り当てられました。 * A /
ドゥないを持参で//未定義の値
}他のIF(コピーが未定義==!){
ターゲット[名] =コピー;
/ *
第三クローン
{} [C] = 1;すなわち、
{C:1} ; Bのの属性値としてオブジェクト
* /
}
}
}
}
//戻り変更されたオブジェクト
戻り対象;
};
``
5、方法を拡張します
注意:値は、時間や配列の重要な役割があるとき、最初の引数は、深いクローンtrueの場合にのみ、クローン化することができる鍵のペアは、値は、データの任意のタイプにすることができます。
JavaScriptの`` `
jQuery.extend(trueに、{
KEY1:VALUE1、
KEY2:値2
})
` ``
例:についてを参照してください。ステップ
HTML `` `:RUN
<!DOCTYPEのHTML>
<HTML LANG = "EN">
<ヘッド>
<METAのcharset = "UTF-8">
<タイトル>タイトル</ TITLE>
<SCRIPT SRC = "https://cdn.bootcss.com/jquery/1.9.1/jquery.js"> </ SCRIPT>
< / HEAD>
<BODY>
</ BODY>
</ HTML>
<スクリプト>
デバッガ;
はconsole.log( "================");
$ .fn.extend(trueに、{A:B {{C:}}} 1);
</ SCRIPT>




jQuery.fn = jQuery.prototype = {
それぞれ:関数(コールバック、引数)が{
jQuery.each(このコールバック、引数)を返します。
}
}。

jQuery.extend({
それぞれ:関数(OBJ、コールバック、引数){
VAR値、
I = 0、
長さ= obj.length、
でIsArray = isArraylike(OBJ);

IF(引数){
(でIsArray){場合
(のために、私<長さ、iは++){
値= callback.apply(OBJ [i]は、引数);

IF(値===偽){
ブレーク;
}
}
}他{
(I OBJで){ための
値= callback.apply(OBJ [i]は、引数)。

{(値===偽)なら
破ります。
}
}
}が

それぞれの最も一般的な使用のために特別な、高速、ケース//
そう} {
(でIsArray){場合
のために(; iは長さ<; iは++){
値= callback.call(OBJ [i]は、I、OBJ [ 私 ] );

{(値===偽)なら
破ります。
}
}
}そうでなければ{
(I OBJで)のために{
値= callback.call(OBJ [i]は、I、OBJ [I])。

{(値===偽)なら
破ります。
}
}
}
}

OBJを返します。
}
})。
`` `

七、jQueryの版文件上传
` `` HTML:実行
<!DOCTYPE HTML>
<HTML>
<HEAD>
<メタのcharset = "UTF-8">
<タイトル>のjQuery版文件上传</ TITLE>
<スクリプトSRC = "https://cdn.bootcss.com/jquery/1.9.1/jquery.js"> </ SCRIPT>
<スタイルタイプ= "テキスト/ CSS">
* {マージン:0;パディング:0;}
.fileSubmit {背景:ライトグレー;高さ:900px;
.fileSubmit .detail {マージン:70ピクセル0 100pxに;}
.fileSubmit .detail .item {フォントサイズ:17px;高さ:40ピクセル、行の高さ:40ピクセル;}
.fileSubmit .detail .itemスパン{表示:インラインブロック;フォントサイズ:17px;}
.fileSubmit .detail .itemボタン{表示:インラインブロック;フォントサイズ:17px;マージン左:は50px;幅:60PX;高さ:25ピクセル、境界半径:5pxの;}
fileSubmit .detail .item入力{フォントサイズ:15ピクセル;マージン左:は50px;幅:210px;高さ:25ピクセル;}
</スタイル>
</ head>
<body>
<DIV CLASS = "fileSubmit">
<ULクラス= "詳細">
<LIクラス= "項目">名称:<スパンID = "名前">工业监测审计系统</スパン> </ LI>
<LIクラス= "項目">型号<スパンID = "タイプ"> INA-200 </スパン> </ LI>
/ BODY> </ HTML> <スクリプトタイプ= "テキスト/ javascriptの"> $( "#upgradeInput")に変更(関数(){ にconsole.log($( "#upgradeInput")のval()); }) ; $(関数(){













$( "#upgradeButton")をクリックします(関数(){。
VAR upgradeInput = $( "#upgradeInput")のval();
はconsole.log(typeof演算(upgradeInput));
場合(upgradeInput === "" || upgradeInput .size <= 0){
アラート( "请上传文件");
リターン;
}
VARのFORMFILE =新しいいるFormData();
formFile.append( "アクション"、 "UploadVMKImagePath");
formFile.append( "ファイル"、upgradeInput) ;

$アヤックス({
URL: "/Admin/Ajax/VMKHandler.ashx"、
データ:FORMFILE、
種類: "ポスト"、
データ型: "JSON」、
キャッシュ:偽、
PROCESSDATA:falseに、
contentTypeの:falseに、
成功:機能(結果){
アラート( "!完了アップロード");
}
})
})
})
</ SCRIPT>
`` `
参考ます。https://www.cnblogs.com/ LoveTX / P / 7081515.html

8、種々の高
1、高さ(コンテンツのみ)
(充填剤を含む)2、innerHeightは、
図3、outerHeight(ボーダーとパディングを含む)
。4、outerHeightが(trueに、パディング、ボーダー、マージンを含みます)








おすすめ

転載: www.cnblogs.com/gushixianqiancheng/p/10966943.html