*

jQueryのセレクター3 parent/contains/hasセレクター

公開日: : 最終更新日:2015/08/03 jQuery ,

前回と同様にjQueryのセレクターを紹介します。

parentセレクター

parentセレクターは、何かしらの子要素や何かしらの
文字を含む要素を指定できるセレクタです。
CSS3のempty擬似クラスと逆のセレクターです。

contains/hasセレクター

containsセレクターは特定の文字列が含まれている要素を
hasセレクターは特定の要素が含まれている要素を指定できます。

下記のサンプルコードだと、「東京」という文字が含まれて
いるので文字が太く、赤くなります。

「神奈川」と文字列を<strong>タグで
囲っているので青くなります。

そして、parentで指定している<li>タグで何かしらの
子要素、文字を含んでいる物の背景は黄緑になります。

実行結果はこちらです。

スポンサードリンク

関連記事

catejQuery

複数の命令をまとめて書く メソッドチェーン

HTML,CSSの命令を書いてきました。 今回紹介するのが「メソッドチェーン」と呼ばれるものです。

記事を読む

catejQuery

設定されたイベント処理を消す

設定されているイベント処理を取り消すには off()命令を使います。 $( セレクター ).

記事を読む

catejQuery

処理のタイミングを決めるイベントについて

jQueryを使ったコードは、セレクターで特定の HTML要素を指定して、CSSやHTMLを変更・

記事を読む

jQuery

jQueryで表示・非表示サイドバーを作ってみる

今回の内容は、クリック操作によってWebページの左側に格納できるサイドバーを作成します。サンプルコー

記事を読む

catejQuery

テキストの取得・変更

HTMLファイルに含まれるテキストをjQueryで 取得・変更するには、text()という命令を使

記事を読む

catejQuery

非表示の要素を表示する show()

show()は、CSSのdisplayプロパティの値が「none」、 非表示のHTML要素を、アニ

記事を読む

catejQuery

パンくずメニューをスライドさせて表示させる。

今回作成するのは、 パンくずリストに動きをつけて表示させる jQueryを作成します。 サ

記事を読む

catejQuery

タブを利用してコンテンツを表示させる。

ページを遷移させず複数のコンテンツを 表示させたい場合使用します。 必要な手順 1.j

記事を読む

catejQuery

クリックしたことを感知するclick()

click()命令はready()と同様に、括弧内のfunction(){...}と記述し その内

記事を読む

catejQuery

空間を最大限に使いトップページの画像をタブで切り替える。

今回、書くのは、 トップページに複数の作品を乗せたいときに、 スクロールさせず、画面上部に配置し

記事を読む

スポンサードリンク

Message

メールアドレスが公開されることはありません。

CAPTCHA


次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">



スポンサードリンク

jQueryMobile
トグルスイッチを設定する

トグルスイッチ(toggle switch)とは、〇型のつまみを左右に

jQueryMobile
項目選択の複数ウィジェットをグループ化する

年月日など、複数のリストから同時に選択したいとき、ウィジェットのグルー

jQueryMobile
<select>により項目選択

ボタンによる選択では、1つの項目だけ選択するか、複数を同時に選択するか

jQueryMobile
値を選択するボタンを表示する

値を選択するボタンは以下の2つがあります。 ・複数の値から1つだ

jQueryMobile
ボタンを設定する

前回の記事では<a data-role="button">

→もっと見る

  • スポンサーリンク

PAGE TOP ↑