HTML nesneleri üzerinde veri taşıma alışkanlığımız HTML5 öncesine dayanıyor. HTML5 bunu standart hale getirdi ve kullanımı yaygınlaştı. Bir ögeye ait verilerin ögenin üzerinde taşıması bize bazı durumlarda çok büyük katkı sağlıyor. İşi abartmamakta yara var :) Hemen örnek ile devam edelim.

<ol>
 <li data-length="2m11s">Deniz kenarı</li>
 ...
</ol>

bu veriyi javascript tarafında yakalamak için jQuery’nin güzel bir metodu var. data()

$(this).data('length') // 2m11s

veri atamak için

$(this).data('lat', '41.015137')

çok kullanışlı bir kod ve kolay bir kullanım.

İnsan normal javascript’te de aynı şeyi arıyor. Arayan buluyor :)

classList benzeri bir kolay erişim özelliği olarak HTML5 dataset özelliği var. Kullanımı jQuery gibi kolay.

<div id="user" data-id="33" data-user="kucka" data-date-of-birth>John Doe</div>

veri yakalamak için

let el = document.querySelector('#user');

el.dataset.id // '33' değerini verir
el.dataset.user // 'kucka' değerini verir

el.dataset.dateOfBirth = '26-02-1987'; // veriyi atayalım

jQuery ile ilişkimizi sonlandırmaya kararlıyım. Tarayıcı desteğini bizim site için güzel IE11 ve sonrası. Daha eski tarayıcılara destek verenler için getAttribute denenebilir.

Kalın sağlıcakla

Kaynaklar

jQuery closest yerine closest() metodunu kullanalım

jQuery'de nkurtulma yöntemlerine devam ediyoruz. Bu sefer closest anlattık Devamını oku

Terminali (iTerm) güzelleştirmek ve iyileştirmek

19 September 2018 tarihinde yayınlandı.

Kitap incelemesi Beyond jQuery - Nicholus, Ray

12 September 2018 tarihinde yayınlandı.