jQueryを使用してname属性が空ではない要素を見つけるにはどうすればよいですか?

jQuery を使用して name 属性が空ではない要素を見つけるにはどうすればよいですか?

Web ページを作成するときは、Web ページの要素を操作する必要があることが多く、場合によっては属性に基づいて特定の要素をフィルタリングする必要があります。 jQueryを使うとセレクターを通じて条件に合う要素を簡単に見つけることができます。この記事では、jQuery を使用して特定の属性を持つ要素を検索する方法とコード例を詳しく説明します。

まず、要件を明確にする必要があります。name 属性が空ではない要素を見つけます。次に、jQuery の属性セレクターを使用して、このタスクを実行できます。属性セレクターは角括弧 [] で表され、要素は角括弧内で属性とそれに対応する値を指定することで検索できます。

具体的なコード例は次のとおりです。

<!-- HTML结构 -->
<div name="test1">元素1</div>
<div name="">元素2</div>
<div>元素3</div>
<div name="test2">元素4</div>

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    // 使用属性选择器查找name属性不为空的元素
    var elementsWithName = $('[name]:not([name=""])');
    
    // 遍历找到的元素并输出其内容
    elementsWithName.each(function(){
        console.log($(this).text());
    });
});
</script>

上記のコードでは、最初に 4 つの div 要素を含む HTML 構造を定義します。その一部には name 属性があります。次に、jQuery ライブラリを導入し、ドキュメントの準備ができたらコードを実行します。コードでは、属性セレクター [name]:not([name=""]) を使用して、name 属性を持つ要素を検索し、name 属性が空ではなく、それを ## に保存します。 #elementsWithName 変数。

次に、

each メソッドを使用してこれらの要素を走査し、$(this).text() を通じて各要素のテキスト コンテンツを取得します。 console.logを通じてコン​​ソールに出力します。

上記のコード例を通じて、jQuery を使用して空ではない name 属性を持つ要素を見つけることに成功し、これらの要素をさらに操作してニーズを達成できます。 jQuery のセレクター機能は強力かつ柔軟であり、操作する必要がある要素を迅速かつ正確に特定し、開発効率を向上させるのに役立ちます。

以上がjQueryを使用してname属性が空ではない要素を見つけるにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。