Apakah ada cara saya dapat memeriksa apakah ada atribut data?

Apakah ada cara agar saya dapat menjalankan yang berikut ini:

var data = $("#dataTable").data('timer');
var diffs = [];

for(var i = 0; i + 1 < data.length; i++) {
    diffs[i] = data[i + 1] - data[i];
}

alert(diffs.join(', '));

Hanya jika ada atribut yang disebut data-timer pada elemen dengan id #dataTable?

if ($("#dataTable").data('timer')) {
  ...
}

CATATAN ini hanya kembali truejika atribut data bukan string kosong atau nilai "falsey" misalnya 0atau false.

Jika Anda ingin memeriksa keberadaan atribut data, bahkan jika kosong, lakukan ini:

if (typeof $("#dataTable").data('timer') !== 'undefined') {
  ...
}

if (typeof $("#dataTable").data('timer') !== 'undefined')
{
    // your code here
}

Demi memberikan jawaban yang berbeda dari yang di atas; Anda bisa memeriksanyaObject.hasOwnProperty(...) seperti ini:

 if( $("#dataTable").data().hasOwnProperty("timer") ){
     // the data-time property exists, now do you business! .....
 }

alternatifnya, jika Anda memiliki beberapa elemen data yang ingin Anda iterate, Anda bisa mengubah-ubah .data()objek dan iterate di atasnya seperti ini:

 var objData = $("#dataTable").data();
 for ( data in objData ){
      if( data == 'timer' ){
            //...do the do
      }
 }

Tidak mengatakan solusi ini lebih baik daripada yang lain di sini, tapi setidaknya itu pendekatan lain ...

Atau kombinasikan dengan beberapa vanilla JS

if ($("#dataTable").get(0).hasAttribute("data-timer")) {
  ...
}

Anda dapat menggunakan metode hasData jQuery.

http://api.jquery.com/jQuery.hasData/

Keuntungan utama dari jQuery.hasData (elemen) adalah tidak membuat dan mengaitkan objek data dengan elemen jika tidak ada saat ini. Sebaliknya, jQuery.data (elemen) selalu mengembalikan objek data ke pemanggil, membuatnya jika tidak ada objek data sebelumnya.

Ini hanya akan memeriksa keberadaan objek data (atau peristiwa) pada elemen Anda, itu tidak akan dapat mengkonfirmasi apakah ia secara khusus memiliki objek "timer".

Jika Anda ingin membedakan antara nilai kosong dan nilai yang hilang, Anda dapat menggunakan jQuery untuk memeriksa seperti ini.

<div id="element" data-foo="bar" data-empty=""></div>

<script>
"foo" in $('#element').data(); // true
"empty" in $('#element').data(); // true
"other" in $('#element').data(); // false
</script>

Jadi dari pertanyaan awal Anda akan melakukan ini.

if("timer" in $("#dataTable").data()) {
  // code
}

Anda dapat membuat jQuery-plugin yang sangat sederhana untuk menanyakan elemen untuk ini:

$.fn.hasData = function(key) {
  return (typeof $(this).data(key) != 'undefined');
};

Maka Anda cukup menggunakan $("#dataTable").hasData('timer')

Gotchas:

• Akan kembali falsehanya jika nilainya tidak ada undefined; jika itu diatur untuk false/ nullitu hasData()masih akan kembali true.
• Ini berbeda dari built-in $.hasData()yang hanya memeriksa apakah ada data pada elemen yang ditetapkan.

Saya telah menemukan ini berfungsi lebih baik dengan secara dinamis mengatur elemen data:

if ($("#myelement").data('myfield')) {
  ...
}

Semua jawaban di sini menggunakan perpustakaan jQuery.

Tapi javascript vanilla sangat mudah.

Jika Anda ingin menjalankan script hanya jika elemen dengan idof #dataTable juga memiliki data-timeratribut, maka langkah-langkah adalah sebagai berikut:

// Locate the element

const myElement = document.getElementById('dataTable');

// Run conditional code

if (myElement.dataset.hasOwnProperty('timer')) {

  [... CODE HERE...]

}

Ini adalah solusi termudah menurut saya adalah memilih semua elemen yang memiliki atribut data tertentu:

var data = $("#dataTable[data-timer]");
var diffs = [];

for(var i = 0; i + 1 < data.length; i++) {
    diffs[i] = data[i + 1] - data[i];
}

alert(diffs.join(', '));

Ini adalah screenshot cara kerjanya.

Jawaban salah - lihat EDIT di bagian akhir

Biarkan saya membangun jawaban Alex.

Untuk mencegah pembuatan objek data jika tidak ada, sebaiknya saya lakukan:

$.fn.hasData = function(key) {
    var $this = $(this);
    return $.hasData($this) && typeof $this.data(key) !== 'undefined';
};

Kemudian, di mana $thistidak ada objek data yang dibuat, $.hasDatakembali falsedan tidak akan dijalankan $this.data(key).

EDIT: fungsi $.hasData(element)hanya berfungsi jika data diatur menggunakan $.data(element, key, value), bukan element.data(key, value). Karena itu, jawaban saya salah.

Saya membutuhkan boolean sederhana untuk bekerja dengannya. Karena tidak terdefinisi dari tidak ada, dan tidak salah, saya menggunakan !!untuk mengonversi ke boolean:

var hasTimer = !!$("#dataTable").data('timer');
if( hasTimer ){ /* ....... */ }

Solusi alternatif menggunakan filter:

if( $("#dataTable").filter('[data-timer]').length!==0) { /* ....... */ }

var data = $("#dataTable").data('timer');
var diffs = [];

if( data.length > 0 ) {
for(var i = 0; i + 1 < data.length; i++) {
    diffs[i] = data[i + 1] - data[i];
}

alert(diffs.join(', '));
}

Anda dapat memeriksa dengan pemilihan atribut css dengan

if ($('#dataTable').is('[data-timer]')) {
   // data-timer attribute exists
}

Dan bagaimana dengan:

if ($('#dataTable[data-timer]').length > 0) {
    // logic here
}