jqueryは別のIDを取得します

Jquery は、DOM 操作と Web 開発を簡素化するために使用される非常に人気のある JavaScript ライブラリです。開発では、さまざまな要素に対してさまざまな操作を実行するために、さまざまな要素の ID を取得することが必要になることがよくあります。この記事では、Jquery を使用してさまざまな ID を取得し、一般的なユースケースを実装する方法を検討します。

1. 単一要素の ID の取得

単一要素の ID の取得は、Jquery で最も一般的な用途の 1 つです。通常、$("#id") Jquery セレクターを使用して要素を選択し、attr('id') メソッドを使用してその ID 値を取得できます。たとえば、次の HTML コードがある場合:

这是一个Div元素 

次のコードを使用して、Div 要素の ID を取得できます:

var myDiv = $("#myDiv").attr('id');

2. 複数の要素の ID を取得

Jquery では、クラス セレクターを使用して複数の要素を選択し、.each() メソッドを使用してそれらを走査できます。その後、attr('id') メソッドを使用して各要素の ID 値を取得できます。たとえば、次の HTML コードがある場合:

Div元素1 
Div元素2 
Div元素3 

次のコードを使用して、これらの Div 要素の ID を取得できます:

$('.myDiv').each(function(){
    var id = $(this).attr('id');
    console.log(id);
});

これにより、各要素の ID がコンソールに出力されます。 。

3. 選択した親要素内の子要素 ​​ID を取得します

場合によっては、親要素内のすべての子要素 ​​ID を取得する必要がある場合があります (例: Build)ナビゲーションメニュー。 .find() メソッドを使用して親要素内のすべての子要素を選択し、.each() メソッドを使用してそれらを反復処理できます。次に、 .attr('id') メソッドを使用して、各子要素の ID 値を取得できます。たとえば、次の HTML コードがある場合:

    

        
主页
        
关于
        
联系我们
    

次のコードを使用して、これらの子要素の ID を取得できます:

var menu = $("#menu");
menu.find('li').each(function(){
    var id = $(this).attr('id');
    console.log(id);
});

これにより、各子要素の ID がコンソール。

4. フォーム要素の ID を取得する

Web 開発では、通常、フォーム要素はフォームの検証と送信のために ID を取得する必要があります。 Jquery セレクター $(":input") を使用してすべてのフォーム要素を選択し、.each() メソッドを使用してそれらを反復処理できます。次に、.attr('id') メソッドを使用して、各フォーム要素の ID 値を取得できます。たとえば、次の HTML コードがある場合:

    
    
    
    提交

次のコードを使用して、これらのフォーム要素の ID を取得できます。

$('form :input').each(function(){
    var id = $(this).attr('id');
    console.log(id);
});

これにより、各フォーム要素の ID がコンソール。

5. 動的に追加された要素の ID を取得する

場合によっては、プログラムで要素を動的に追加し、その ID を取得することが必要になることがあります。この場合、Jquery セレクター $(":last") を使用して最後の要素を選択し、.after() メソッドを使用してその後に新しい要素を追加できます。次に、.attr('id') メソッドを使用して新しい要素の ID を取得できます。たとえば、次の HTML コードがある場合:

    按钮1

次のコードを使用して、新しいボタンを動的に追加し、その ID を取得できます:

var newButton = $('按钮2');
$("#myDiv button:last").after(newButton);
var id = newButton.attr('id');
console.log(id);

これにより、新しいボタンの ID が出力されます。コンソール。

結論

この記事では、Jquery を使用してさまざまな要素の ID を取得する方法を詳しく説明しました。単一要素または複数要素の ID を取得する場合でも、フォーム要素または動的に追加された要素の ID を取得する場合でも、上記のメソッドを使用してそれを実現できます。この記事があなたの開発作業に役立つことを願っています。

以上がjqueryは別のIDを取得しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。