Jquery：獲取html元素的屬性值

Question

我正在開發一個在線測驗應用程序。按照章節劃分測驗，以便每章都有自己的測驗。每章都附加到一個菜單上，並在菜單上點擊，一章加載了一些內容，最後還有一個按鈕來開始測驗。

當用戶參加測驗時，會有一個按鈕導航到下一個問題。在完成最後一個問題時，測驗的分數將顯示在按鈕旁邊，以便點擊導航到下一章。所有這些都是動態完成的。我想要的是，在這個按鈕將導航到下一章，我通過在這個按鈕中的下一章的ID

這是jquery位處理我上面描述的最後一部分（點擊事件處理提出了一個問題）：

$(document).ready(function(){ 
    $("#page-content-wrapper").on('click', '.questionform #submit', function(e) 
    { 
      //more code before this 
      var next_chapter = $("a[data-menu='" + next_menu +"']")[0]; 
      console.log(next_chapter); 
    }); 
}); 

變量next_chapter保存完整的HTML鏈接的下一級菜單。即

console.log(next_chapter);

回報：

<a href="#signs-giving-orders" id="2" data-menu="2">Signs Giving Orders</a>

現在我想的是捕捉id，並通過它的按鈕值。我已經試過讓同時使用.find和.attr方法id作爲這樣的：

var next_chapter = $("a[data-menu='" + next_menu +"']")[0].attr('id'); 
var next_chapter = $("a[data-menu='" + next_menu +"']")[0].find('a').attr('id'); 

但上述兩種拋出一個錯誤：分別Uncaught TypeError: $(...)[0].attr is not a function和Uncaught TypeError: $(...)[0].find is not a function。

因此，在短期，如何取回此動態結果的ID：<a href="#signs-giving-orders" id="2" data-menu="2">Signs Giving Orders</a>

Answer 1

是的，因爲jQuery的元素，而不是本地的.attr()方法一個

所以做這個

var next_chapter = $("a[data-menu='" + next_menu +"']")[0].id; 

多一個選項

var next_chapter = $("a[data-menu='" + next_menu +"']")[0].getAttribute('id'); 

A LSO，您可以檢查https://www.w3schools.com/jsref/met_element_getattribute.asp

而且 https://developer.mozilla.org/en/docs/Web/API/Element/attributes

Answer 2

你並不需要使用[0]，它返回引用原生的DOM元素這樣你得到的錯誤。

當你想要得到的屬性值，直接jQuery對象上使用.attr()

var next_chapter = $("a[data-menu='" + next_menu +"']").attr('id'); 
                 //Notice [0] is removed