読者です 読者をやめる 読者になる 読者になる

ハロトレWebデザインの勉強 | 求職者支援訓練Webサイト制作科 フェリカテクニカルアカデミー

未経験者からプロになるハロートレーニングWebデザインの勉強

関数とメソッド

jQueryの関数

  • jQueryは、関数オブジェクトです
  • JavaScriptは、プリミティブ型とオブジェクト型で構成される
  • プリミティブ型は、変数として使う型
  • それ以外はオブジェクト型です
<script>
$(function() {
  alert( typeof( jQuery ) );
});
</script>

  • typeof 演算子を使って、引数の中の要素の型を調べることができます
  • 結果「function」と表示され、関数オブジェクトであることがわかります
jQuery = window.jQuery = function( ){ };


jQueryとは、Windowオブジェクトのプロパティで、その中身は関数オブジェクトです。
そして、jQueryの関数とは「jQuery関数オブジェクトが持つ関数オブジェクト」を指します。

jQueryの関数構文
jQuery.myFunction( );


インスタンスを使って記述》

$.myFunction( );
jQueryのdata関数
jQuery.data( element, key, value );
  • element:対象となる要素
  • key:データを指定する文字列
  • value:格納するデータの値

jQueryのメソッド

  • 何らかの命令を出す部分
  • jQueryのメソッドはjQueryセレクタが持つ関数オブジェクトになります
  • 引数 (パラメータ)が必要な場合もあります



$( 'セレクタ' ) . メソッド ( パラメータ );

$( セレクタ ).method( );
CSS系メソッド
  • 要素のCSSを操作するためのメソッド
属性系メソッド
  • 要素の属性を操作するためのメソッド
HTML系メソッド
  • HTMLそのものを操作するためのメソッド
トラバース系メソッド
  • トラバースとは「横断」という意味
  • HTMLを横断してその中から要素を検索するようなイメージのメソッド
エフェクト系メソッド
  • 要素をアニメーションさせたり、フェードさせたりとエフェクトを加えるメソッド
イベント系メソッド
  • プログラムを動かすためのきっかけを指定することができるメソッド
Ajax系メソッド
  • Ajaxをを操作するメソッド

メソッドチェーン

  • jQueryには、メソッドを連結させて順番にメソッドを処理していく仕組みがあります
  • 順番にメソッドを処理できる条件として、実行メソッドがセレクタを返す必要があります



$( 'セレクタ' ) . メソッド ( パラメータ ) . メソッド ( パラメータ ) . メソッド ( パラメータ );

noConflict関数


ショートカットの衝突を回避する

jQuery.noConflict( );