jQueryの例


jQuery の例

jQuery のスキルを向上させたいですか?


jQuery selector

$(this).hide()

現在の HTML 要素を非表示にする jQuery の Hide() 関数を示します。

$("p").hide()

すべての <p> 要素を非表示にする jQuery の Hide() 関数を示します。

$(".test").hide()

class="test" を持つすべての要素を非表示にする jQuery の hide() 関数を示します。

$("#test").hide()

id="test" の要素を非表示にする jQuery の hide() 関数を示します。


jQuery イベント

jQuery click() イベントを示します。

jQuery dblclick()

jQuery dblclick() イベントを示します。

jQuery Mouseenter()

jQueryのmouseenter()イベントを示します。

jQuery Mouseleave()

jQuery Mouseleave() イベントを示します。

jQuery Mousedown()

jQuery Mousedown() イベントを示します。

jQuery Mouseup()

jQuery Mouseup() イベントを示します。

jQuery hover()

jQuery hover() イベントを示します。

jQuery focus() および Blur()

jQuery focus() および Blur() イベントを示します。

分析例


jQuery Hide/Show

jQuery Hide()

jQuery Hide() メソッドを示します。

jQuery Hide() と show()

jQuery の Hide() メソッドと show() メソッドを示します。

jQuery toggle()

jQuery toggle()は、hide()メソッドとshow()メソッドを切り替えるために使用されます。

jQuery Hide()

テキストを非表示にする別の例。

分析例


jQueryのフェードインとフェードアウト

jQuery fadeIn()

jQuery fadeIn()メソッドを示します。

jQuery fadeOut()

jQuery fadeOut()メソッドを示します。

jQuery fadeToggle()

jQuery fadeToggle() メソッドを示します。

jQuery fadeTo()

jQuery fadeTo()メソッドを示します。

分析例


jQuery slide

jQuery slideDown()

jQuery slideDown() メソッドを示します。

jQuery slideUp()

jQuery slideUp() メソッドを示します。

jQuery slideToggle()

jQuery slideToggle() メソッドを示します。

分析例


jQueryアニメーション

jQuery animate()

単純なjQuery animate()メソッドを示します。

jQuery animate() - 複数の CSS プロパティを設定します
jQuery animate() メソッドを使用してスタイルを変更する方法を示します。

jQuery animate() - 相関値の使用
jQuery animate() メソッドで相関値を使用する方法を示します。

jQuery animate() - 事前定義された値の使用
animate() メソッドを使用して、事前定義された「非表示」、「表示」、「切り替え」値を示します。

jQuery animate()
その他の jQuery animate() メソッドの例を示します

jQuery animate()
その他の jQuery animate() メソッドの例 (複数の animate() コールバック)を示します。

分析例

jQuery アニメーションを停止する

jQuery stop() スライド
jQuery stop() メソッドを示します。

jQuery stop() アニメーション (パラメーター付き)
jQuery stop() メソッドを示します。

分析例


jQuery HTMLの取得と属性

jQuery text() と html() - テキストとコンテンツを取得します
jQuery text() メソッドと html() メソッドを使用してコンテンツを取得します。

jQuery val() - 値の取得
jQuery val() メソッドを使用して、フォームのフィールド値を取得します。

jQuery attr() - 属性値の取得
属性値を取得するには、jQuery attr() メソッドを使用します。

分析例


jQuery HTMLの設定内容と属性

jQuery text()、html()、val() - 内容の設定
jQuery text()、html()を使用および val() メソッドを使用してコンテンツを設定します。

jQuery text() と html() - コンテンツを設定し、コールバック関数を使用します
text() と html() を使用してコンテンツを設定し、コールバック関数を使用します

jQuery attr() - 属性値を設定します
Set jQuery attr() メソッドの属性値を使用します。

jQuery attr() - 複数の属性値を設定する
jQuery attr() メソッドを使用して、複数の属性値を設定します。

jQuery attr() - 属性値を設定し、コールバック関数を使用します
属性値 + を設定し、コールバック関数を使用して attr() を呼び出します

jQuery append()

選択した要素の末尾にコンテンツを追加します

jQuery prepend()選択した要素の先頭にコンテンツを追加します


jQuery append() - 複数の要素を挿入します

新しいテキスト/HTML 要素、jQuery および JavaScript/DOM を革新します。新しい要素のテキストの後に追加されます。 jQuery after() と before() 選択した要素の前後に HTML 要素を追加します。
jQuery after() - 複数の要素を挿入します。

新しいテキスト/HTML 要素、jQuery および JavaScript/DOM を革新します。選択した要素の末尾に新しい要素を挿入します。


分析例




jQuery HTML 要素/コンテンツを削除


jQuery Remove()

選択した要素を削除

jQuery empty() 選択した要素のすべての子要素を削除


jQuery delete() - パラメーターを使用して要素をフィルター

し、インスタンス解析を削除します


jQuery CSSクラスを取得および設定します

jQuery addClass()
異なる要素にクラス属性を追加します

jQuery addClass() - 複数のクラス
複数のクラスを追加するにはaddClass()メソッドを使用します

jQuery RemoveClass()
指定した要素のクラスを削除

jQuery toggleClass()
選択した要素のクラスを切り替え(追加/削除)

インスタンス解析


jQuery css()メソッド

jQuery css() - CSS プロパティを返します

最初に一致した要素の CSS プロパティ値を返します

jQuery css() - CSS プロパティを設定します

すべての構成要素で指定された CSS プロパティを設定します

jQuery css( ) - CSS プロパティを設定します

複数の一致する要素の CSS プロパティを設定します

インスタンス解析


jQuery Size

jQuery - width() と height() を返します

幅と高さを返します指定された要素の内側の幅/高さを返します

jQuery - innerWidth() と innerHeight() を返します

指定された要素の内側の幅/高さを返します

jQuery - externalWidth() と externalHeight() を返します

の外側の幅/高さを返します指定された要素

jQuery - externalWidth(true ) と innerHeight(true) を返します

指定された要素の外幅/高さ (外枠を含む) を返します

jQuery - ドキュメントとウィンドウの width() と height() を返します

HTMLドキュメントとウィンドウの幅と高さを返します

jQuery - width()とheight()を設定します

指定された要素の幅と高さを設定します

インスタンス分析


jQuery Traversal - Ancestor

jQueryparent()

jQueryparent()メソッドのデモを行います。

jQueryparents()

jQueryparents() メソッドを示します。

jQueryparentsUntil()

jQueryparentsUntil() メソッドを示します。

分析例


jQuery トラバーサル - 子孫

jQuery Children()

jQuery Children() メソッドを示します。

jQuery find()

jQuery find() メソッドを示します。

分析例


jQuery トラバーサル - 兄弟

jQuery Brothers()

jQuery Brothers() メソッドを示します。

jQuery next()

jQuery next() メソッドを示します。

jQuery nextAll()

jQuery nextAll() メソッドを示します。

jQuery nextUntil()

jQuery nextUntil() メソッドを示します。

分析例


jQuery AJAXload()メソッド

jQueryload()

ファイルの内容を非同期的にロードし、それを<div>要素に挿入します。

jQueryload()

ファイルコンテンツで指定された要素コンテンツを非同期的に読み込み、<div>要素に挿入します。

jQueryload() - コールバック関数を使用する(callback)
jQueryload()メソッドのコールバック関数を使用します。

分析例


jQuery AJAX get() および post() メソッド

jQuery get()
$.get() メソッドを使用してサーバーからデータを非同期に取得します

jQuery post()
$.post()メソッドを使用してサーバーからデータを非同期に取得します

インスタンス分析