jQueryで隠しタグを取得する方法

王林
リリース: 2023-05-23 11:54:07
オリジナル
746 人が閲覧しました

DOM 操作に jQuery を使用する場合、非表示のスタイルを持つ DOM 要素を操作する必要がある場合があります。この場合は、非表示のタグを取得する必要があります。では、jQuery はどのようにして隠しタグを取得するのでしょうか?

最初に理解する必要があるのは、jQuery には、隠しタグを取得する 2 つの方法 (.hidden.not(:visible)) が用意されていることです。次に、この 2 つの方法を詳しく紹介します。

  1. .hidden

jQuery の .hidden は、display であらゆるものを選択できる特別なセレクターです。 : なし; スタイル要素。 .hidden の使用方法は次のとおりです。

$(".hidden")       // 选取具有 hidden 类的元素
ログイン後にコピー

たとえば、次のコードを通じて、id を持つ要素を test として取得できます。 :

<div id="test" class="hidden">这是一个隐藏元素</div>
ログイン後にコピー
var element = $("#test.hidden");
ログイン後にコピー

上記のコードの element 変数は、div 要素となり、idtest になります。 hidden クラスがあります。

  1. .not(:visible)

要素の display 値が none の場合、その場合、.hidden が適切な選択です。ただし、要素が visibility: hidden または opacity: 0 などを使用して非表示になっている場合、.hidden セレクターは使用できません。現時点では、.not(:visible) を使用して非表示のタグを取得できます。

.not(:visible) は、:visible セレクターの否定バージョンであり、 display:none ;## の使用を含む、非表示の要素を選択します。 #、または非表示の要素に可視性を設定します。 .not(:visible) の使用方法は次のとおりです。

$(":not(:visible)")        // 选取具有不可见样式的元素
ログイン後にコピー

たとえば、次のコードを使用して、

test の id を取得できます。 要素:

<div id="test" style="visibility: hidden;">这是一个不可见的元素</div>
ログイン後にコピー
var element = $("#test").not(":visible");
ログイン後にコピー
上記のコードの

element 変数は、idtest# である div 要素になります。 ##、それは目に見えないからです。 概要

上記のどちらの方法も非表示タグを取得するために使用できますが、要素がどのように非表示になっているかに基づいて適切な方法を選択する必要があります。

.hidden

display: none; に等しい要素を選択できますが、 .not(:visible)display の使用を含め、すべての非表示要素を選択できます。 none;、または非表示の要素に可視性を設定します。 つまり、jQuery で隠しタグを取得することは非常に一般的な操作であり、上記の方法をマスターすると、実際の開発がより快適になります。

以上がjQueryで隠しタグを取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート