Почему попытка чтения атрибутов данных не отображается на моем сайте?

Question

Я пробовал это в jsfiddle, но он работал, но я не могу получить атрибуты данных для работы на моем сайте. В этом случае я получаю «неопределенный» в предупреждении:

<div data-test="something"></div> 
<script>alert($('div').data('test'));</script> 

В чем причина этого?

Answer 1

У вас есть много div's в вашем страница и .data() будут предупреждать первый div. Таким образом, у вас есть два варианта получения значения данных.

1. Используйте родительский класс div и значение предупреждения.

$(document).ready(function(){
alert($('div.entry-content').children().data('test'));
});

DEMO FIDDLE

ПРИМЕЧАНИЕ: Я просто использовал родительский DIV класс, который вы используете на своем сайте.

1. Положите некоторые id или class в DIV и использовать, чтобы оповещать значение данных.

КОД:

<div id="datatest" data-test="something"></div> 

$(document).ready(function() { 
    alert($('div#datatest').data('test')); 
}); 

DEMO FIDDLE With ID

Answer 2

В jsfiddle вы настроили dom ready. И я думаю, вы просто скопируете код в теге скрипта.

вам не хватает dom ready здесь

<script> 
$(document).ready(function(){ 
    alert($('div').data('test')); 
}); 
</script> 

Answer 3

У вас есть много Div на вашем сайте, но этот скрипт только оповещает первого Div в data-test

редактирования: т.е. первого найденного в DOM

Fiddle

Решение: добавить идентификатор к div вы хотите получить data-test от

Answer 4

$('div') является слишком общим селектора. В this fiddle с ровно одним элементом ваш код работает нормально. Однако, в this fiddle с несколькими элементами, ваш код не:

<div></div> 
<div data-test="something"></div> 
<script>alert($('div').data('test'));</script> 

$('div') выбирает каждый <div> на странице, но .data только получает значение первого элемента в коллекции JQuery:

... вернуть значение в названном хранилище данных для первого элемента в наборе согласованных элементов.

Таким образом, вы пытаетесь получить атрибут data-test для первого элемента в коллекции, которая, в моем примере выше, не имеет такого атрибута. Вам нужно сделать селектор более конкретным, чтобы выбрать нужный элемент. Вы можете попробовать:

• с использованием id на элементе и выбрав его с $('div#someIdOnTheDiv')
• менее предпочтительно, возьмите любой <div>, который имеет data-test атрибут: $('div[data-test]')