Есть ли способ проверить, существует ли атрибут данных?

Есть ли способ, которым я могу запустить следующее:

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(', '));

Только, если в элементе есть атрибут, называемый таймером данных, с идентификатором #dataTable?

Ответ 1

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

ПРИМЕЧАНИЕ: это возвращает true только в том случае, если атрибут data не является пустой строкой или значением "falsey", например, 0 или false.

Если вы хотите проверить наличие атрибута данных, даже если он пуст, сделайте следующее:

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

Ответ 2

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

Ответ 3

В интересах предоставления другого ответа от приведенных выше; вы можете проверить его с помощью Object.hasOwnProperty(...) следующим образом:

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

альтернативно, если у вас есть несколько элементов данных, которые вы хотите перебрать, вы можете изменить объект .data() и перебрать его так:

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

Не сказать, что это решение лучше, чем любое из других здесь, но, по крайней мере, это другой подход...

Ответ 4

Или объединить с некоторой ванилью JS

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

Ответ 5

Вы можете использовать метод jQuery hasData.

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

Основное преимущество jQuery.hasData(element) заключается в том, что он не создает и не связывает объект данных с элементом, если в настоящее время он не существует. Напротив, jQuery.data(element) всегда возвращает объект данных вызывающему, создавая один, если ранее объект данных не существовал.

Это будет проверять наличие каких-либо объектов данных (или событий) на вашем элементе, оно не сможет подтвердить, имеет ли он конкретный объект "таймер".

Ответ 6

Если вы хотите различать пустые значения и отсутствующие значения, вы можете использовать jQuery для проверки, как это.

<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>

Итак, из оригинального вопроса вы сделаете это.

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

Ответ 7

Вы можете создать чрезвычайно простой jQuery-плагин для запроса элемента для этого:

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

Затем вы можете просто использовать $("#dataTable").hasData('timer')

Gotchas:

  • Вернет false только в том случае, если значение не существует (это undefined); если он установлен на false/null, он hasData() все равно вернет true.
  • Он отличается от встроенного $.hasData(), который только проверяет, установлены ли какие-либо данные в элементе.

Ответ 8

Я нашел, что это работает лучше с динамически установленными элементами данных:

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

Ответ 9

Неверный ответ - см. EDIT в конце

Позвольте мне ответить на ответ Алекс.

Чтобы предотвратить создание объекта данных, если он не существует, я бы лучше:

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

Тогда, когда $this не создан объект данных, $.hasData возвращает false, и он не выполнит $this.data(key).

Функция EDIT: $.hasData(element) работает, только если данные были установлены с помощью $.data(element, key, value), а не element.data(key, value). Из-за этого мой ответ неверен.

Ответ 10

Мне нужно было простое логическое для работы. Поскольку он undefined отсутствует, а не false, я использую !! для преобразования в boolean:

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

Альтернативным решением будет использование фильтра:

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

Ответ 11

Это самое простое решение, на мой взгляд, - выбрать весь элемент с определенным атрибутом данных:

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(', '));

Вот скриншот, как это работает.

консольный журнал селектора jquery

Ответ 12

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(', '));
}

Ответ 13

Вы можете проверить выбор атрибута css с помощью

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

Ответ 14

А как насчет:

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

Ответ 15

Все ответы здесь используют библиотеку jQuery.

Но ванильный JavaScript очень прост.

Если вы хотите запустить скрипт только в том случае, если элемент с id из #dataTable также имеет атрибут data-timer, тогда выполните следующие действия:

// Locate the element

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

// Run conditional code

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

  [... CODE HERE...]

}