JavaScript'te Liste Öğesinin İçindeki Bağlantının Kimliğini Alma

Javascript Te Liste Ogesinin Icindeki Baglantinin Kimligini Alma



Kullanıcı bir düğmeye tıkladığında yanıt verenler gibi etkileşimli web sayfaları oluşturmak için JavaScript en iyi seçimdir. Kullanıcıların yaratıcı ve dinamik tasarımlar yapmasına olanak sağlar. Bunu, işlevlerdeki HTML öğelerinin kimliklerini değiştirerek yapar. Bir HTML öğesinin kimliği, JavaScript'teki çeşitli yerleşik yöntemler kullanılarak elde edilebilir.

Bu makale, JavaScript'te bir liste öğesi içindeki bağlantı öğesinin kimliğini alma prosedürünü sağlar.

JavaScript'te Liste Öğesinin İçindeki Çapanın Kimliği Nasıl Alınır?

Bir öğenin ID özelliği, o öğeyi bir JavaScript işlevinde işlemek ve kullanmak için kullanılabilen benzersiz bir tanımlayıcıdır. Kullanıcılar, çeşitli yöntemlerle öğenin kimliğini kullanarak öğeyi alabilirler. Ancak bir HTML öğesinin kimliğini almak zor olabilir. Ancak bir HTML öğesinin ID niteliğini almak biraz karmaşık olabilir.







Benzer şekilde, bir “içindeki ankraj elemanları durumunda liste öğesi ”, kullanıcı doğrudan bağlantı elemanını çağırıp kimliğini alamaz çünkü bir listede birden fazla bağlantı elemanı bulunacaktır. Bu durum için aşağıda verilen gösterim, bir liste öğesi içindeki Bağlantı elemanının kimliğinin nasıl alınacağını gösterir:





< HTML >

< vücut >

< div >

< ul İD = 'liste' >

< O >

< A İD = 'çapa1' href = '#' > Ankraj Elemanı 1 < / A >

< / O >

< O >

< A İD = 'çapa2' href = '#' > Sabitleme Elemanı 2 < / A >

< / O >

< O >

< A İD = 'çapa3' href = '#' > Sabitleme Elemanı 3 < / A >

< / O >

< / ul >

< / div >

< P > Yukarıdaki Listeden Bağlantı Elemanlarının Kimliklerini Almak için aşağıdaki Düğmeye tıklayın! < / P >

< düğme tıklamada = 'İşlevim()' > Kimlikleri al < / düğme >

< P İD = 'kök' >< / P >

< senaryo >

işlev işlevim() {

let listItems = document.querySelectorAll('#list a[id]');

için (i = 0 olsun; i < listeÖğeler.uzunluk; i++ ) {

izin vermek İD = listeÖğeler [ Ben ] . İD ;

document.getElementById ( 'kök' ) .innerHTML + =

'Bağlantı Elemanının Kimliği' + ( ben + 1 ) + ' dır-dir: ' + İD + '
';

}

}

< / senaryo >

< / vücut >

< / HTML >

Yukarıdaki kodun açıklaması şu şekildedir:



  • Kimliği olan sırasız bir liste “ liste ”,“ içinde oluşturulur ve bulunur
    ” etiketleri.
  • Liste öğeleri içinde üç bağlantı etiketi oluşturulur ve kimliklerle sağlanır ' çapa1 ', ' çapa2 ', Ve ' çapa3 ' sırasıyla.
  • Daha sonra bir “

    ” öğesi oluşturulur ve bir miktar metin içeriği içerir.

  • Daha sonra “ kullanılarak bir düğme öğesi oluşturulur. ” etiketleri. “ tıklamada() Butonun ” özelliği “adlı fonksiyonla sağlanmaktadır. işlevim() ”.
  • Boş '

    ”kimliği olan öğe” için ' yaratıldı.

  • Daha sonra, “içinde

    Aşağıdaki çıktıdan, bağlantı elemanları bir liste halinde mevcut olup, kullanıcı “ID” butonuna tıklayarak kimliklerini alabilmektedir. Kimlikleri al ' düğme.



    Bu tamamen liste öğelerinin içindeki bağlantı elemanlarının kimliklerini almakla ilgilidir.

    Çözüm

    Bir liste öğesi içindeki bağlantı öğesinin kimliğini almak için yerleşik JavaScript ' document.querySelectorAll() ” yöntemi kullanılabilir. Ayrıca bu bağlantı elemanlarının elde edilen kimlikleri, yerleşik JavaScript kullanılarak web sayfasına yazdırılabilir. .innerHTML() ' yöntem. Bu makale, JavaScript'te bir liste öğesi içindeki bağlantı öğesinin kimliğini alma prosedürünü sağladı.