Contoh penggunaan kaedah index() dalam jQuery_jquery

Contoh dalam artikel ini menerangkan penggunaan kaedah index() dalam jQuery. Kongsikan dengan semua orang untuk rujukan anda. Analisis khusus adalah seperti berikut:

Kaedah ini boleh mencari elemen padanan dan mengembalikan nilai indeks elemen. Nilai indeks bermula dari 0.

Struktur tatabahasa 1:

Apabila kaedah ini tidak mempunyai parameter, nilai pulangan ialah kedudukan indeks elemen yang ditentukan dalam koleksi elemen adik-beradiknya.

Salin kod Kod adalah seperti berikut: $(selector).index() Kod contoh:

Contoh 1:

Salin kod Kod adalah seperti berikut: index() function-Script Home rentang{ warna:merah; } Laman Utama Skrip $(dokumen).sedia(fungsi(){ $("#btn").klik(fungsi(){ $("span").text($(".qian").index()); }) }); Kawasan belakang pentas Kawasan meja hadapan Kawasan Pangkalan Data Komunikasi Juruweb Kedudukan elemen li semasa: 0 Klik untuk melihat hasil Kod di atas boleh mengembalikan nilai indeks elemen li dengan nama kelas qian dalam set elemen adik beradiknya. Melihat perkara ini, anda mungkin mempunyai soalan sedemikian, sama ada unsur adik beradik itu adalah unsur yang serupa untuk mengatakan, elemen li berada dalam elemen li Nilai indeks dalam koleksi.

Contoh 2:

Salin kod Kod adalah seperti berikut: index() function-Script Home rentang{ warna:merah; } Laman Utama Skrip $(dokumen).sedia(fungsi(){ $("#btn").klik(fungsi(){ $(".index").text($("#sou").index()); }) }); Kawasan belakang pentas Kawasan meja hadapan Kawasan Pangkalan Data Komunikasi Juruweb Pengoptimuman Carian Kedudukan elemen li semasa: 0 Klik untuk melihat hasil Seperti yang anda boleh lihat daripada kod di atas, ia bukan sekadar elemen daripada jenis yang sama, tetapi semua elemen daripada generasi yang sama.

Struktur tatabahasa 2:

Apabila parameter kaedah ialah objek DOM atau objek jQuery, nilai pulangan ialah indeks objek DOM atau objek jQuery ini dalam koleksi elemen yang ditentukan. Jika objek DOM atau objek jQuery yang ditentukan tidak ditemui dalam koleksi elemen yang ditentukan, nilai pulangan ialah -1.

Salin kod Kod adalah seperti berikut: $(selector).index(elemen) Senarai parameter:

<table class="t_table" cellspacing="0" style="border-bottom: rgb(227,237,245) 1px solid; border-left: rgb(227,237,245) 1px solid; text-transform: none; background-color: rgb(255,255,255); text-indent: 0px; width: 669px; border-collapse: collapse; font: small/19px Tahoma, 'Microsoft Yahei', Simsun; word-wrap: break-word; white-space: normal; empty-cells: show; table-layout: auto; letter-spacing: normal; height: 57px; color: rgb(68,68,68); border-top: rgb(227,237,245) 1px solid; border-right: rgb(227,237,245) 1px solid; word-spacing: 0px; -webkit-text-stroke-width: 0px"> 参数 描述 element 获得index位置的 DOM对象或者jQuery对象。 Kod contoh:

Contoh 1:

Salin kod Kod adalah seperti berikut: index() function-Script Home rentang{ warna:merah; } Laman Utama Skrip $(dokumen).sedia(fungsi(){ $("#btn").klik(fungsi(){ $("span").text($("li").index(document.getElementById("qian"))); }) }) Kawasan belakang pentas Kawasan meja hadapan Kawasan Pangkalan Data Komunikasi Juruweb Kedudukan elemen li semasa: 0 Klik untuk melihat hasil Contoh 2:

Oleh kerana tiada unsur sepadan ditemui, nilai pulangan ialah -1.

Salin kod Kod adalah seperti berikut: index() function-Script Home rentang{ warna:merah; } Laman Utama Skrip $(dokumen).sedia(fungsi(){ $("#btn").klik(fungsi(){ $(".index").text($("li").index(document.getElementById("sou"))); }) }); Kawasan belakang pentas Kawasan meja hadapan Kawasan Pangkalan Data Komunikasi Juruweb Pengoptimuman Carian Kedudukan elemen li semasa: 0 Klik untuk melihat contoh Struktur tatabahasa tiga:

Apabila parameter kaedah ialah pemilih, elemen akan ditemui daripada koleksi objek yang diperoleh melalui pemilih ini.

Salin kod Kod adalah seperti berikut: $(selector).index(Jqselector) Senarai parameter:

<table class="t_table" cellspacing="0" style="border-bottom: rgb(227,237,245) 1px solid; border-left: rgb(227,237,245) 1px solid; text-transform: none; background-color: rgb(255,255,255); text-indent: 0px; width: 668px; border-collapse: collapse; font: small/19px Tahoma, 'Microsoft Yahei', Simsun; word-wrap: break-word; white-space: normal; empty-cells: show; table-layout: auto; letter-spacing: normal; height: 57px; color: rgb(68,68,68); border-top: rgb(227,237,245) 1px solid; border-right: rgb(227,237,245) 1px solid; word-spacing: 0px; -webkit-text-stroke-width: 0px"> 参数 描述 Jqselector 选择器，将会从通过此选择器获得的对象中查找元素。

Kod contoh:

Salin kod Kod adalah seperti berikut: index() function-Script Home rentang{ warna:merah; } Laman Utama Skrip $(dokumen).sedia(fungsi(){ $("#btn").klik(fungsi(){ $(".index").text($("#qian").index("li")); }) }); Kawasan belakang pentas Kawasan meja hadapan Kawasan Pangkalan Data Komunikasi Juruweb Pengoptimuman Carian Kedudukan elemen li semasa: 0 Klik untuk melihat contoh Kod di atas akan memperoleh kedudukan indeks elemen li dengan nilai id qian dalam koleksi objek li yang diperolehi melalui pemilih li.

Saya harap artikel ini akan membantu pengaturcaraan jQuery semua orang.