質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

1436閲覧

ページ内のidの取得を簡潔にしたいです

5o5o_wagon

総合スコア214

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2015/10/09 10:18

編集2015/10/09 10:23

###前提・実現したいこと

以下の2つの条件をクリアした場合のみ、<div id="box">をdisplay:none;に変更するjQueryの記述をしたいです。

【条件】
1.ページ内にid="wrapper"がある
2.<div id="box">内に<span class="tag">がない
※補足:<span class="tag">は他のjsの制御で増えたり消えたりします。

###発生している問題・エラーメッセージ

以下のようなjsで制御しようと試していましたが、もっと簡潔にid="wrapper"の取得をできないかなと思っています。

###ソースコード

html

<section id="wrapper"> <div id="box"> <span class="tag"> <a href="#">ボタン</a> </span> </div> </section>

js(こんな感じで試しています)

if($('#box').parents('section').is('#wrapper') && !$('#box').children('span').hasClass('tag')){ $('#box').hide(); }

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

iggy

2015/10/28 05:55

知識がないのでもう少し説明がほしいです。
guest

回答2

0

ベストアンサー

1.ページ内にid="wrapper"がある

と書かれていますが、コードを見ると「祖先要素にid="wrapper"がある」でいいんでしょうか?
それでしたら、こんな感じで。

$('#wrapper #box:not(:has("span.tag"))').hide();

投稿2015/10/09 10:30

編集2015/10/09 10:32
Lhankor_Mhy

総合スコア35865

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

5o5o_wagon

2015/10/09 11:25

早速の回答ありがとうございます! >コードを見ると「祖先要素にid="wrapper"がある」でいいんでしょうか? はい! 想定していた挙動になりました! また、とても簡潔なコード教えていただきありがとうございます!
guest

0

こんにちは。以下でどうでしょうか?

javascript

1if($("box").closest("#wrapper").length > 0 && !$('#box').children('span').hasClass('tag')){ 2 $('#box').hide(); 3}

投稿2015/10/09 10:28

編集2015/10/28 06:04
hirai0110

総合スコア240

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

5o5o_wagon

2015/10/09 11:27

早速の回答ありがとうございます! 動きました! ただ、こちらの説明不足ですが、できればもう少し変更に耐えやすい簡潔なコードを教えていただきたいです!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問