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

Ответ 1

Element.getAttribute возвращает null или пустую строку, если атрибут не существует.

Вы использовали бы Element.hasAttribute:

if (!object.hasAttribute("data-params")) {
    // data attribute doesn't exist
}

или Element.dataset (см. также: in operator):

if (!("params" in object.dataset)) {
    // data attribute doesn't exist
}

или даже

if (!object.getAttribute("data-params")) {
    // data attribute doesn't exist or is empty
}

Ответ 2

Проверка на null также дала решение.

if (object.getAttribute("data-params") === null) {
//data attribute doesn't exist
 }else{
 //data attribute exists
 }

Ответ 3

Код, который вы опубликовали, не будет работать так, как вы ожидаете, то, что вы здесь делаете, проверяет, равно ли значение атрибута именованного атрибута ("data-params") "undefined", которое вернется true, только если атрибут data-params="undefined".

if (object.getAttribute("data-params") === "undefined") {
   // the "data-params" attribute-value is exactly "undefined"
   // note that `getAttribute()` is a 
}

Я подозреваю, что вы хотите:

var typeOfObjectAttribute = typeof object.getAttribute("data-params");

if (typeOfObjectAttribute === null || typeOfObjectAttribute === "") {
   // data-params attribute doesn't exist on that Node.
}

Обратите внимание, что – в соответствии с Mozilla Developer Network (ссылка для Element.getAttribute(), ниже) – утверждает, что:

getAttribute() возвращает значение указанного атрибута для элемента. Если данный атрибут не существует, возвращаемое значение будет либо null, либо "" (пустая строка) & hellip;

Также стоит отметить, что getAttribute() - это метод узлов Element, а не общих объектов.

Кстати, вы также можете использовать следующий подход (опять же, тестирование того, что атрибут не установлен):

// here we look to see if the 'params' key is present in the
// HTMLElement.dataset object of the element, and then invert
// that result using the '!' operator, to check that the
// attribute *isn't* present:
if (!('params' in document.getElementById('elementID').dataset)) {
    // the data-params attribute is not present.
}

Литература:

• Element.getAttribute().
• HTMLElement.dataset.
• in оператор.
• typeof оператор.

Ответ 4

Вы могли бы просто использовать API-интерфейс набора данных.

HTMLElement.dataset

Свойство HTMLElement.dataset для чтения позволяет получить доступ как в режиме чтения, так и записи ко всем атрибутам пользовательских данных (data- *), установленным в элементе. Это карта DOMString, одна запись для каждого пользовательского атрибута данных.

К сожалению, это не сработает в IE10, но я уверен, что там есть прокладка.

Вот пример

var containerData 	= document.querySelector('#container').dataset,
    contentData 	= document.querySelector('#content').dataset;

// Check if dataset is empty or not.
console.log(Object.keys(containerData).length === 0);
console.log(Object.keys(contentData).length === 0);

// Check for specific data
if (containerData.hasOwnProperty('bar')) {
  console.log(containerData.bar);
}

// Here is the dataset
console.log(containerData);

<div id="container" data-foo="bar" data-bar="foo">
  <div id="content">
    Content
  </div>
</div>

Ответ 5

Попробуйте использовать typeof:

if(typeof object.getAttribute("data-params") === "undefined") {
   console.log('data-attribute doesn't exist');
}

Ответ 6

Вы можете сделать только проверку значения фальшивости

if(!object.getAttribute("data-params")) {
   //data-attribute doesn't exist
}

cause getAttribute может возвращать пустую или пустую строку

также вы можете использовать object.hasAttribute("data-params") только для проверки наличия атрибута

Ответ 7

Единственное, что сработало для меня, было это.

if(typeof object.dataset.sheet === "undefined") {
  console.log('Data attribute does not exist');
}

Ответ 8

Еще проще:

if (object.dataset.sheet !== undefined) {
  // the "data-sheet" attribute exists
}

Ответ 9

Чтобы увидеть, имеет ли данный элемент HTML5 определенный пользовательский атрибут HTML5 data-*, просто изучите элемент dataset.

dataset является DOMStringMap объектом, поэтому вы можете использовать метод hasOwnProperty():

if (element.dataset.hasOwnProperty('params')) {

  [... CODE HERE...]

}