Получение html data- * атрибута из другой ссылки в том же внешнем контейнере

Question

Ниже приведен код HTML, который генерирует раздел с одним конкретным продуктом из списка продуктов woocommerce. Я поставил функцию directLink() в кулачная ссылка, поэтому я могу перенаправить человека на страницу с помощью «data-product_sku» из последней ссылки этого раздела.

От щелчка даже я только изменил, чтобы найти эту конкретную ссылку на странице, но я не могу получить данные data-product_sku из нее, кроме как просто разбора ее как строки, но я уверен, что есть способ найти это прямо с javascript.

HTML:

<li class="post-2028"> 
    <a href="http:..." class="woocommerce-LoopProduct-link"> 
    <span onclick="directLink(event); return false;"> 
     First Link 
    </span> 
    <div itemprop="description"> 
    <p>...Product Description...</p> 
    </div> 
    </a> 
    <a href="http:..." data-quantity="1" data-product_id="2028" data-product_sku="323"> 
    Last Link 
    </a> 
</li> 

ЯШ:

function directLink(e) { 
    var elmnt = e.path[2].children[1]; 
} 

я получаю

elmnt = '<a href="http:..." data-quantity="1" data-product_id="2028" data-product_sku="323">Last Link</a>' 

Я также попробовал:

var elmnt = e.path[2].children[1]; 
$(elmnt).data('product_sku'); 

, но это дает undefined

Как я могу получить этот атрибут js?

Answer 1

Вы chould сделать следующее:

e.path[2].children[1].dataset.product_sku 

будет вернуть то, что вы ожидаете 323

Answer 2

Вы хотите использовать() метод .attr. Попробуйте что-нибудь наподобие

$(elmnt).attr('data_product_sku'); 

В качестве альтернативы это не требует jQuery. Используя чистый JavaScript, это будет выглядеть как

elmnt.getAttribute('data_product_sku');