JavaScript'te Öğeleri Değiştirme Üzerine Pratik
Bir dizi verildi. Elemanlarını ul
listesi şeklinde görüntüleyin.
Önceki görevi, herhangi bir li
öğesine tıklandığında, düzenlenebilmesi
için bir input kutusunun görünmesini
sağlayacak şekilde değiştirin.
Önceki görevi, listenin altına, ul
listesinin sonuna yeni bir öğe eklemek
için kullanılabilecek bir input kutusu
ekleyecek şekilde değiştirin. Yeni
li öğelerinin de düzenlenebilir
olmasını sağlayın.
Önceki görevi, her li öğesinin
sonuna, bu li öğesini ul
listesinden silmek için kullanılabilecek
'sil' bağlantısı gelecek şekilde
değiştirin.
Önceki görevi, her li öğesinin
sonuna ayrıca, ilgili li etiketinin
metninin üzerini çizmek için kullanılabilecek
'üstünü çiz' bağlantısı gelecek
şekilde değiştirin.
Nesne Dizisi ve Tablo
Aşağıdaki çalışan dizisi verildi:
javascriptlet employees = [
{name: 'employee1', age: 30, salary: 400},
{name: 'employee2', age: 31, salary: 500},
{name: 'employee3', age: 32, salary: 600},
];
Bu çalışanları bir HTML tablosunda görüntüleyin.
Oluşturulan tablonun hücrelerine düzenleme özelliği ekleyin.
Tablonuza, bir satırı tablodan silmek için bağlantı içeren yeni bir sütun ekleyin.
Tablonun altına yeni çalışan eklemek için
3 input kutusu ve bir buton yapın.
Input kutularına isim, yaş ve maaş girilsin
ve butona tıklandığında yeni çalışan tabloya
eklensin. Yeni eklenen çalışanlar için de
hücre düzenleme özelliğini uygulayın.
Nesne Dizisi ve Liste
Aşağıdaki çalışan dizisi verildi:
javascriptlet employees = [
{name: 'employee1', age: 30, salary: 400},
{name: 'employee2', age: 31, salary: 500},
{name: 'employee3', age: 32, salary: 600},
];
Her çalışanı kendi li etiketinde,
ul etiketinin içinde ekranda
görüntüleyin.
Bir çalışanın ismine, yaşına veya maaşına tıklandığında, o alanı düzenlemek için bir input kutusunun görünmesini sağlayın.
Her li etiketinin sonuna, bu
li öğesini listeden silmek için
bir bağlantı ekleyin.
Listein altına yeni çalışan eklemek için bir form yapın.