jQuery:DOMとイベント

1.ライブラリとフレームワークの違いを話しますか?

ライブラリはメソッドの集合であり、多くのカプセル化された関数を提供し、ライブラリを追加した後、これらのメソッドを直接使用することができます.

フレームワークは、彼の名前のように、開発者が内容を記入する必要がある一般的なフレームワークを持つ製品です.

2.jqueryは何ができるの?

より便利なDOM要素の取得:$といくつかの内蔵関数

を利用

ページスタイルを動的に変更するには、addClass

を使用します.

DOM:appendなどの関数

を動的に修正する

応答ユーザ操作:イベント傍受関数

アニメーション効果:animate,show,hideなどの関数

互換性が良い

3.jqueryオブジェクトとDOMオリジナルオブジェクトの違いは何ですか?変換方法

jQueryのオブジェクトは配列オブジェクトであり、DOMのオリジナルオブジェクトに対するパッケージである.

DOMをjQueryに変換するには$(オブジェクト)

を使用する必要があります.

jQeryをDOM原生に変換するには$(対象)が必要である.eq(対応する位置)

4.jqueryでイベントをバインドする方法bind、unbind、delegate、live、on、offはどんな役割を果たしていますか?どちらがおすすめですか?onバインドイベントを使用してイベントエージェントの書き方を使用しますか?

は、on、bind、live、delegateなどの関数を使用してバインドすることができる.

 var $('.btn').on('click',fuction(){
 #code....
 })
 

bind:bind(type,data,callback)は要素に直接バインドされる

live:live(type,data,callback)はbindのアップグレードバージョンであり、要素にバインドできるだけでなく、自身の「イベント依頼」の実現方法のため、後に追加された子孫要素にも同様に作用する.例えば$('.a').live('click',callback)は、clickがdocumentにバブルし、a要素である限り、一致します.

unbind:削除前のバインドイベント

delegate:指定された要素(選択された要素のサブ要素)は、1つ以上のイベント$("#container")をバインドする.delegate("a","click",function(){alert("OK");})中のaラベルバインドイベント

on:on(events,[selector,data,callback])選択要素に1つ以上のイベントをバインドするイベント処理関数(live,bind,delegateは1.7バージョン以降に置き換えられる)

off:on関数を除去するためのイベントバインド

onの使用をお勧めします.最新のサポートが多いので、前のいくつかのバインド関数の機能が乱れていて、まだ停止しています.

 $('.target').on('click','selector',function(){
 #code.......
 })
 

5.jqueryはどのように要素を表示/非表示にしますか?

 $('.target').show();
 $('.target').hide();
 

6.jqueryアニメーションはどのように使用しますか?

 $('.target').animate({left:"200px",top:"100px"},100,function(){
 #code
 })//         fast  slow
 .stop:      
 .finish:           
 .clearQueue:          
 

7.エレメント内部のHTMLコンテンツの設定と取得方法要素の内部テキストを設定して取得するにはどうすればいいですか?

 //     
 $(".target").html()
 $(".target").text()
 //     
 $(".target").html('< p >nihao< p >')//     html  
 $(".target").text('nihao')//    
 

8.フォーム・ユーザーが入力または選択した内容を設定および取得する方法要素のプロパティを設定して取得するにはどうすればいいですか?
取得フォーム入力内容:

$("#input").val()

取得フォーム選択内容:

$("#input:checked").val()

取得要素属性:

$('.target').attr()

設定要素属性:

$('.target').attr('src',$img.attr('data-img'))