Bu gönderi, bir dizi JavaScript nesnesinde bir nesne kimliği bulma yöntemini belirtti.
JavaScript'teki append() Yöntemi nedir?
“ ekle() JavaScript'te '' yöntemi, öğenin sonuna öğeleri veya dize nesnelerini eklemek için kullanılır. Bu, gerekli elemanı elemanın sonunda belirtilen konuma eklemek için en kullanışlı yöntemlerden biridir.
JavaScript'te append() Yöntemi Nasıl Kullanılır?
JavaScript'te append() işlevini kullanmak için aşağıda belirtilen sözdizimini izleyin:
＄ ( seçici ) . eklemek ( içerik, işlev ( indeks, html ) )
Burada:
- “ seçici ”, erişilen HTML öğesidir.
- “ ekle() ” metodu elemanı eklemek için kullanılır.
- “ içerik ” eklenecek veri içeriğini belirleyen gerekli parametredir.
- “ işlev() ” isteğe bağlı bir öğedir.
Örnek 1: Aynı Öğeyi Paragrafa Ekle
Aynı öğeleri bir paragrafa eklemek için önce ilgili HTML sayfasını açın ve “ Verileri etiket arasına gömmek için ” etiketi. Ayrıca, bir “ atayın İD ” JavaScript'te erişmek için paragrafa:
< p kimliği = 'öğe' > Linuxhint'e hoş geldiniz P >
Ardından, “ yardımıyla bir düğme oluşturun.
Şimdi, “
< senaryo >
$ ( belge ) . hazır ( işlev ( ) {
$ ( '.btn' ) . tıklamak ( işlev ( ) {
$ ( '#element' ) . eklemek ( 'Düğmeye tıklandığında metin ekle' ) ;
} ) ;
} ) ;
senaryo >
Verilen koda göre:
- “ hazır() Doküman başarılı bir şekilde ekrana yüklendiğinde bir fonksiyonu kullanılabilir hale getirmek için ” yöntemi kullanılır. Bunu yapmak için “ işlev() parametre olarak ” yöntemi.
- “ tıklamak() ” yöntemi, kullanıcı HTML düğme öğesine tıkladığında çağrılır. Bu yöntem, bir kullanıcı düğmeye bastığında tıklamanın yürütülmesini belirler.
- “ ekle() ” yöntemi, “ yürütüldükten sonra bir dizi nesne ekler. tıklamak() ' yöntem. Bu amaçla, eklenmesi gereken metni iletin.
Çıktı
Örnek 2: Liste Formunda Farklı Öğeler Ekleme
Farklı öğeleri bir liste şeklinde ekleyebilirsiniz. Bunu yapmak için, bir HTML sayfası oluşturun ve '' yardımıyla metni gömün. ' etiket:
< p kimliği = 'ekle' > JavaScript Ekleme ( ) İşlev P > “ kullanarak bir düğme yapın
Bir div kapsayıcısı yapın ve “ kullanarak o kapsayıcıya bir kimlik atayın. İD ' bağlanmak. Ardından, '' yardımıyla öğeleri ekleyin. ' etiket:
< div kimliği = 'daha fazla öğe' >< P > eleman 1 P >
< P > eleman 2 P >
div >
Ardından, “
var ElementNumber = 3 ;
işlev işlevi ( ) {
bir ebeveyndi = belge. getElementById ( 'daha fazla öğe' ) ;
yeni öğeydi = '
Öğe'
+ ElemanNumarası + '' ;ebeveyn. Ekle BitişikHTML ( 'önceki' , ve Öğe ) ;
ElemanNumarası ++;
}
senaryo >
Yukarıda belirtilen kodda:
- “ kullanarak bir değişken bildirin öyleydi ” anahtar sözcüğünü seçin ve tercihinize göre bir değer atayın.
- Bir işlev tanımlayın ve tanımlanmış işlev içinde belirli bir adla başka bir değişken başlatın.
- Ardından, “ getElementById() ” Öğeye erişmek ve id değerini parametre olarak iletmek için JavaScript yöntemi.
- “ insertAdjacentHTML() ” yöntemi, HTML kodunu belirtilen bir konuma eklemek ve öğeyi birbirine bitişik eklemek için kullanılır.
- Öğede bir artış yapmak için artırma operatörünü kullanın:
Apend() yönteminin JavaScript'te kullanımını çeşitli örneklerle öğrendiniz.
Çözüm
“ ekle() ”, tanımlı elemanın sonuna eleman ve nesneleri eklemek için kullanılan bir JavaScript yöntemidir. Aynı öğeyi ve farklı öğeleri paragraf ve liste şeklinde ekleyebilirsiniz. Daha spesifik olarak, bir düğme tıklamasıyla tetiklenebilir. Bu gönderi, JavaScript'te append() yöntemini gösterdi.