--- title: 'Veri Öznitelikleri' source: 'https://academia.sh/tr/kurslar/web-temelleri-ve-html/veri-oznitelikleri' course: "Web'in Temelleri ve HTML" language: tr updated: '2026-08-17T18:09:32+00:00' license: 'CC BY-SA 4.0' --- # Veri Öznitelikleri Belgeye ad çakışması olmadan veri iliştirmek, öznitelik adı ile program tarafındaki anahtarın dönüşümü ve değerlerin dizgi olma sonucu. Önceki dersler belgeye anlam kazandıran ögeleri tamamladı. Geriye tanımlı bir anlamı olmayan ama işe yarayan bir düzenek kalıyor: her ögeye takılabilen, ad çakışması üretmeyen ve program tarafından okunabilen öznitelikler. Sorun şudur: bir ögeye, dilin tanımlamadığı bir bilgi iliştirmek gerekebilir — bir sensörün kimliği, bir kaydın durumu, bir bölümün yenilenme aralığı. Bu bilgi belgede görünmez ama davranış katmanının ona erişmesi gerekir. ## Neden Ayrı Bir Düzenek Böyle bir bilgiyi taşımanın kendiliğinden akla gelen yolları sorunludur. Var olan bir özniteliği amacı dışında kullanmak —örneğin `title` ya da `class` içine veri gömmek— o özniteliğin tanımlı davranışını bozar: `title` ekran okuyucuda duyurulur, `class` sunum katmanının seçicilerine karışır. Kendi adını uydurmak —`sensor-id="4"` gibi— geçerli bir belge üretmez. İşaretleme Dili Kavramı dersinde belirtildiği gibi ayrıştırıcı bilinmeyen özniteliği saklar, dolayısıyla çalışır; ancak dile ileride gerçekten `sensor-id` adında bir öznitelik eklenirse belgedeki anlam sessizce değişir. `data-` öneki bu iki soruna birden yanıt verir. Önek dile ayrılmıştır: dilin kendi öznitelikleri hiçbir zaman bu önekle başlamaz, dolayısıyla çakışma olanaksızdır. Ve tanımlı bir davranışı yoktur: değeri okunmadıkça hiçbir şey yapmaz. ```html

Nem sensörü yeniden ayarlandı

``` ## Ad Dönüşümü Öznitelik adı ile program tarafındaki anahtar arasında tanımlı bir dönüşüm vardır. Öznitelik adı küçük harfle ve tireli yazılır; program tarafında önek düşer ve tireler kaldırılıp sonraki harf büyütülür. ```js // veri.mjs — data-* adi ile dataset anahtari arasindaki donusum function ozniteliktenAnahtara(yazilanAd) { const ad = yazilanAd.toLowerCase(); // ayristirici oznitelik adlarini kucultur if (!ad.startsWith("data-")) return null; return ad.slice(5).replace(/-([a-z])/g, (_, harf) => harf.toUpperCase()); } function anahtardanOznitelige(anahtar) { if (/-[a-z]/.test(anahtar)) return null; // kucuk harften once tire yasaktir return "data-" + anahtar.replace(/[A-Z]/g, (harf) => "-" + harf.toLowerCase()); } const oznitelikler = [ "data-istasyon", "data-olcum-araligi", "data-son-kalibrasyon-tarihi", "data-x2", "data-Sensor", "class", ]; console.log("oznitelik adi dataset anahtari geri donusum"); for (const ad of oznitelikler) { const anahtar = ozniteliktenAnahtara(ad); const geri = anahtar === null ? "—" : anahtardanOznitelige(anahtar); console.log(ad.padEnd(30) + String(anahtar ?? "—").padEnd(23) + String(geri)); } console.log("--- degerler her zaman dizgidir ---"); const kumesi = { istasyon: "kuzey-yamac", olcumAraligi: "600", etkin: "false" }; for (const [anahtar, deger] of Object.entries(kumesi)) { console.log(anahtar.padEnd(14), JSON.stringify(deger), "-> typeof:", typeof deger); } console.log("Number(olcumAraligi) =", Number(kumesi.olcumAraligi)); console.log('Boolean("false") =', Boolean(kumesi.etkin)); ``` ``` oznitelik adi dataset anahtari geri donusum data-istasyon istasyon data-istasyon data-olcum-araligi olcumAraligi data-olcum-araligi data-son-kalibrasyon-tarihi sonKalibrasyonTarihi data-son-kalibrasyon-tarihi data-x2 x2 data-x2 data-Sensor sensor data-sensor class — — --- degerler her zaman dizgidir --- istasyon "kuzey-yamac" -> typeof: string olcumAraligi "600" -> typeof: string etkin "false" -> typeof: string Number(olcumAraligi) = 600 Boolean("false") = true ``` Beşinci satır bir tuzağı gösterir: `data-Sensor` yazımı beklenen anahtarı üretmez, çünkü Etiketler, Öznitelikler ve Varlıklar dersinde belirtildiği gibi ayrıştırıcı öznitelik adlarını küçültür. Öznitelik adında büyük harf kullanılmaz; çok sözcüklü adlar tireyle ayrılır. Dördüncü satır rakamların dönüşüme girmediğini gösterir: tire yalnızca kendisinden sonra küçük harf geliyorsa kaldırılır. ## Değerler Dizgidir Çıktının ikinci bölümü, veri özniteliklerinin en sık gözden kaçan özelliğini gösterir: değerler her zaman dizgidir. Sayı yazılmış olsa bile dizgi olarak okunur ve karşılaştırmalarda çevrilmesi gerekir. Son satır bunun mantıksal değerlerdeki sonucudur. `"false"` dizgisi boş olmadığı için doğru sayılır; `Boolean` çevrimi beklenen sonucu vermez. Mantıksal bir bilgi taşınacaksa iki yol vardır: değeri açıkça karşılaştırmak, ya da mantıksal özniteliklerin kuralını izleyip **varlığı** anlam saymak — özniteliği yazmak doğru, hiç yazmamak yanlış demektir. ## Ne Zaman Uygun Değil Veri özniteliği bir depolama alanı değildir. Üç durumda kullanılmaz. **İçerik taşımak için.** Belgede görünmesi gereken bir metin bir veri özniteliğine yazılırsa, kaynak metinde vardır ama belgede yoktur: seçilemez, aranamaz, çevrilmez ve ekran okuyucuya sunulmaz. **Dilin karşılığı olan bir bilgi için.** Bir ögenin devre dışı olduğu, bir bölümün gizlendiği, bir alanın zorunlu olduğu bilgisi dilde tanımlıdır ve o öznitelikle bildirilir. Bu bilgiyi veri özniteliğine yazmak, erişilebilirlik ağacına hiçbir şey iletmez. **Büyük veri için.** Öznitelik değerleri belgeyle birlikte her istekte gönderilir ve belge büyüdükçe ayrıştırma da yavaşlar. Bir kaydın tamamını ögeye iliştirmek yerine kimliğini iliştirip veriyi ayrı istemek yeğlenir. ## Durum Bildirimi: Sınıf mı, Veri mi Bir ögenin o andaki durumunu —seçili, yükleniyor, hatalı— bildirmenin iki yolu vardır ve ikisi de kullanımdadır. Sınıf adı eklemek yaygındır ama sınıf listesi bir küme olduğu için değer taşımaz: "durum yükleniyor" bilgisi ancak `yukleniyor` adlı bir sınıfın varlığıyla anlatılır ve birden çok durumdan yalnızca birinin geçerli olması elle korunur. Eski durumu silmek unutulursa iki durum aynı anda görünür. Veri özniteliği bir ad–değer çiftidir; `data-durum="yukleniyor"` yazımında yeni değer eskisinin yerini alır ve iki durumun aynı anda bulunması olanaksızdır. Sunum katmanı bu değeri öznitelik seçicisiyle okur; seçiciler sonraki kursun konusudur. Bu ayrım, kullanıcıya duyurulması gereken durumlar için geçerli değildir. Bir alanın hatalı olduğu, bir düğmenin basılı olduğu, bir bölümün açık olduğu bilgisi erişilebilirlik ağacına iletilmelidir ve bunun yolu dilin kendi öznitelikleri ile ARIA durum öznitelikleridir. Veri özniteliği bu ağaca hiçbir şey iletmez. ## Dışarıya Açılan Veri Veri öznitelikleri belgeyi yazan ile belgenin kendi betikleri arasındaki bir sözleşmedir. Adları serbesttir, anlamları belgeye özgüdür ve dışarıdan bir program onlardan bir şey çıkaramaz. Bilgi dışarıya —dizinleyicilere, toplayıcılara— açılacaksa bu düzenek yetmez; ortak bir sözcük dağarcığı gerekir. Belgeye gömülen yapılandırılmış veri sözleşmeleri bu işi görür ve tanımlı bir kavram kümesine dayanır. Ayrım şudur: `data-` kendi programınız için, yapılandırılmış veri başkasının programı için. ## İstasyon Belgesinde ```html

Kalibrasyon Kayıtları

Nem sensörü yeniden ayarlandı

Referans değere göre yüzde iki sapma düzeltildi.

``` İliştirilen üç değerin üçü de belgede görünmesi gerekmeyen, davranış katmanının işine yarayacak bilgilerdir. Kaydın tarihi ise veri özniteliğine değil `time` ögesine yazılmıştır: o bilgi hem görünür hem de dilde karşılığı olan bir bilgidir. ## Özet - `data-` öneki dile ayrılmıştır; bu önekle yazılan öznitelikler dilin özellikleriyle çakışmaz ve tanımlı bir davranışları yoktur. - Öznitelik adı küçük harfle ve tireli yazılır; program tarafındaki anahtar önek düşürülüp tireden sonraki harf büyütülerek üretilir. - Değerler her zaman dizgidir; sayısal karşılaştırmalarda çevrilir, mantıksal bilgide `"false"` dizgisi doğru sayılır. - Belgede görünmesi gereken içerik, dilde karşılığı olan bilgi ve büyük veri bu özniteliklere yazılmaz. ## Sonraki Adım Belge bu noktada yapılı, bölümlenmiş ve medya taşır durumda; ancak tek yönlü. Okuyucu bilgi alıyor, veremiyor. Sonraki konu bu yönü açar: bir formun sunucuya gerçekte ne gönderdiğini, o gövdenin nasıl kodlandığını ve gönderim başlamadan önce hangi denetimlerin yapıldığını ele alır. İlk ders, gönderimin kendisiyle başlar.