いつも使うテキストや数値、計算式、よく指定する要素などを変数に入れて使い回すと、パフォーマンスにも優れ、メンテナンス性も良くなります。
ここではjQueryにおける変数の基本的な説明や、さまざまな使い方をご説明します。
jQuery
jQueryでalert()を使ういろいろな方法
alert()はダイアログを表示させるjavascriptのメソッドです。
jQueryでalert()を表示させる基本的な方法から、confirm()で「OK」「キャンセル」のダイアログを表示させたり、入力ダイアログを表示させる方法などをご紹介します。
jQueryのlengthで要素や文字列、配列をカウント
jQueryのlengthは要素や文字数、配列の値をカウントしてくれます。
単純に文字数を数えたり、要素が存在するか、配列に値が入っているか判定したりと便利なプロパティです。
同様の処理をするsize()はjQuery3.0で廃止されたため、lengthでカウントしましょう。
jQuery.trim()で前後の空白などを削除
jQuery.trim()は文字列の前後にある空白を削除する便利なメソッドです。半角空白だけでなく、全角空白、改行やタブも削除できます。
送信された文字列やインポートしたファイルに混入した余計な空白などを一発で削除できますね。
ただし、文字列の先頭と最後の空白しか処理されないため、中間にある空白は削除されません。
jQueryでsplit()を使って文字列を分割
jQueryで文字列をバラバラに分割できるsplit()を扱う方法のご紹介です。split()は文字列に含まれる,(カンマ)や/(スラッシュ)等の特定の文字で分割し、配列として返してくれますので、csvデータをカンマで分割したり、改行の箇所で分割したりといろいろと使えますね。
jQueryのslice()で要素、文字列、配列を切り取る方法
jQueryで要素、文字列、配列を切り取る場合はslice()を使うと便利です。リストの2番目～4番目の要素だけを取得したり、文字列の最初から4文字目までを取得したり、配列の3番目を取り出したり等、いろいろな方法で取得できます。
jQueryのnot()で要素を除外するいろいろな方法
jQueryで特定の要素を除いて処理をさせる場合はnot()を使うと便利です。奇数を除いて偶数の要素にのみ色を付けたり、選択した要素以外に処理を設定することも可能です。
メソッドタイプのnot()とセレクタに指定する:not()も併せてご紹介します。
jQueryでメガメニューを簡単自作
jQueryでプラグインに頼らず、簡単にメガメニューを実装する方法のご紹介です。
プラグインを使わなくても意外と簡単にヌルヌル動くメガメニューを実装できますので、ぜひ試してみてください。
jQueryのindex()で順番を取得する
要素の順番を取得するindex()の使い方をご説明します。
タブメニューなどでクリックした順番を取得したりと、便利に使う方法もお伝えします。
jQueryのeq()で順番を指定する方法
特定の要素にのみ処理をさせたり、順番を取得する際に便利なeq()メソッドはいろいろな場面で使うことになるでしょう。
基本的な使い方はもちろん、最後から数える方法や、複数の要素を取得したり、変数化した順番を指定したりとさまざまな使い方をご紹介します。
よく使うメソッドですので、これを機に使いこなせるようになりましょう。
