JavaScriptのWebフレームワーク（のpython3エントリー）

1つのJS導入

< HTML > 
    < 身体> 
    </ ボディ> 
    < スクリプトSRC = "JS / xxx.js" > </ スクリプト> 
    < スクリプト> 
        // JS代码块
    </ スクリプト> 
</ HTML >

JS導入

2つのJS基本データ型

//値型：文字列ブール未定義

//参照型：関数オブジェクト（DIC）が

ヌルアレイ日正規表現数学：特定のオブジェクト型を//

3つのJS配列と辞書操作

//配列
VARのARR = [5,2 ,. 3 ,. 1 ,. 4。]; 
//抜き（）|プッシュ（）
//シフト（）| POP（）
//スプライス（beginIndexパラメータ、ctrlCount、newArgs）; 
//ソート（）

//辞書
VAR DIC = { 
    K1：V1、
    ... 
    KN：VN 
} 
//キーが文字列型である必要があり、値は任意の型であってもよい
//どの辞書メンバー：dic.key | DIC [ 'キー' ] 
//削除dic.keyを削除

JSの配列と辞書操作

4つのJS機能

コードブロック{}の//関数function関数名（パラメータリスト）1.定義
関数もう一度Fn1（）{ 
    にconsole.log（ 'I機能もう一度Fn1である'）; 
} 
VAR Fn2が=関数（）{ 
    にconsole.log（「I関数FN2は'）; 
}; 
//は、匿名関数をJS：のみ定義フェーズで一度呼び出すことができます
（関数（）{ 
    はconsole.log（'私は無名関数だ「）; 
}）（）; //（FN定義）（ ）最初の（）FNは、メモリアドレスを取得するために、全体として定義され、第二（）関数呼び出しがある

//関数名（引数リスト）2.関数を呼び出す
もう一度Fn1を（）; 
Fn2が（）; 

/ /（3）戻り値JS関数の戻り値とのみ
機能のFn3（）{ 
    返さ//戻り値が明示的に未定義ではない

    ヌル未定義戻す// 
    返す; // 

    //正常値戻す
    // 10リターン; 

    / /戻り複数の値場合、JSのみ最後の値20を返すことができるされている
    // 10、20を返すあり; 

    //は、辞書や配列によって達成複数の値を返す方法
    [10、20]を返します 
} 
ヴァーのFn3 RES =（）; 
にconsole.log（RES）; 

パラメータ関数// 4 
// I）の形状に関与する引数の数を均一にする必要はないが、それは位置基準を通過しなければならない
こと、b）{（機能FN4 //ローパス引数、パラメータは、成形、マルチパス引数で割り当てられていないので、マルチパス引数は破棄される
    にconsole.log（B）
} 
FN4（10、20、30）

// IIを）帯状の基準値は、パラメータのデフォルト値は、ランダムの位置で
関数fn5（B = 10 {// Bは）、C、D = 20 、cは、C割り当てが理由を与える前に、デフォルトの値はほとんど意味を対応有する特定上に割り当てB 
    にconsole.log（A、B、C、D）
} 
Fn5（100、200、300）; 

// III）引数...不定長パラメータ
関数FN6（... B） { //パラメータは、可変長配列が格納されている
    にconsole.log（A、B）
} 
（ 'ボブ'} ,. 1,2 ,. 3 ,. 4 ,. 5 {名）FN6を

JSの機能動作

5つのjsの完全なインタラクティブページ

JSセレクタラベルオブジェクトによって// 1.取得のページ
オブジェクトの// 2.結合事象、タグがトリガされたイベントは、バインドする関数を呼び出しますとき
// 3のバウンド以内に指定された機能を完了ビジネスロジック

JSは、本体の下部に書かれなければならないページで// JSの完全な相互作用、
JSセレクタにより// 1.取得のページラベルオブジェクトは
//最初のラベルオブジェクトに一致するように取得することはありません、CSSの構文パラメータを選択ある
VAR = document.querySelectorボックス（「ボディ■は」）; 
//ラベルに一致するすべてのオブジェクトを取得することはありません、CSSセレクタの構文のためのパラメータ（どのように多くのことではありません必ずしも結果が配列である）
のvar boxs = document.querySelectorAllは（ '■は'）; 

はconsole.log（ボックス）; 
はconsole.log（boxs）; 
はconsole.log（boxs [1]）; 

// 2.ターゲットラベルオブジェクト（自分の）道の結合相互作用（イベント）
/ / 3.ビジネスロジック内の特異的な相互作用のイベントを完了
{//これはシステムボックスである）（= box.onclick機能を、この関数内のすべてのオブジェクトを取得するには、コールバックをクリックすると、それは内部のボックスする必要があります
    '（にconsole.logをBOX1）は、「これをクリックした; 

    //は、コンテンツを取得
    するvar MSG = this.innerTextを; 
    にconsole.log（MSG）; 
    //コンテンツ
    this.innerHTML = " < B >ああ</ B> 「; 
    // getComputedStyle形式（ページオブジェクト、で満たされていない時に擬似クラスをnull）の.jsスタイル名の構文の実施形態の取得
    = VARをgetComputedStyleのfontSize（これは、null）.fontSize; 
    はconsole.log（のfontSize）; 
    //スタイルを設定します
    = this.style.backgroundColor "赤"; 
    this.style.marginLeft = '100pxに'; 
    //クラス名の取得
    VARをクラス名= this.className; 
    にconsole.log（クラス名）; 
    //設定されたクラス名
    this.className + = " 「ビッグ; //スペースを省略することができない
} 


[1] // boxs .onmouseover =関数（）{ 
//はconsole.log（ '懸濁液がBOX2た'）
//}

jsの完全なインタラクティブページ

継続するには

JavaScriptのWebフレームワーク（のpython3エントリー）

おすすめ