如何使用jQuery從SPAN元素中提取名稱屬性？

我有一個HTML文件，我正在用我正在使用jQuery的greasemonkey腳本進行刮擦。如何使用jQuery從SPAN元素中提取名稱屬性？

HTML頁面非常長，但是我在整個頁面中都有一些<span>元素。

假設這些元素是這樣的：

<span id="spnMX45" name="spnMX45" >16</span> 
<span id="spnMX46" name="spnMX46" >10</span> 
<span id="spnMX47" name="spnMX47" >11</span> 
<span id="spnMX48" name="spnMX48" >5</span>

有，我從這些元素需要兩個值：我需要「spnMX」後到來的數量和範圍的文本。

我將用這些值填充數組並將它們發送出去進行處理。我能做的大部分，但抓住name或id屬性一直是一個問題。

這就是我目前所面對的：

// Grab Max Points for assessments 
var maxPointsArray = $("span[id^=spnMX]").map(
    function(data){ 
    arr = [this.Attr('name')]; 
    return arr; 
    } 
); 

console.log(maxPointsArray.length); // yields: 9 <--actual number of span elements in test html 
console.log(maxPointsArray); // yields: 9 undefined objects

我已經試過：

arr = [this.name]; 
arr = this.name; 
arr = [this.attr('name')]; 
arr = this.Attr('name');

我似乎無法得到它。跨度屬性無法抓取？我懷疑這一點，但我無法弄清楚這一點。我已經成功完成了幾個不同的輸入類型元素的確切事情。我無法成功抓取這個對象的text()，但我似乎無法獲得該名稱或id甚至屬性。

來源

2013-07-01 pedwards

$（本）.attr（ '名稱'）; – Aguardientico

你不能在span元素上有一個name屬性，它在HTML中是不允許的。 – Quentin

需要注意的是：

的Javascript（和jQuery）區分sensiti五個。 .attr有效; .Attr不是。
this裏面的一個.map()^Doc循環不是一個jQuery對象。因此，爲了使用像.attr()這樣的jQuery函數，您需要使用$(this).attr()。
jQuery .map()在映射數組上非常強大，但它返回一個jQuery對象。使用.get()作爲最終結果。
由於您的jQuery選擇器使用id，並且id與name（無效的HTML！），使用id來提取該值。

把它放在一起;使用（See it in action at jsFiddle）：

var maxPointsArray = $("span[id^=spnMX]").map (
    function (index) { 
     var text = $.trim (this.textContent); 
     var idVal = this.id.replace (/spnMX/, ""); 

     //-- This will make a two-dimensional array: 
     return [ [idVal, text] ]; 
    } 
).get(); 

console.log (maxPointsArray.length); 
console.log (maxPointsArray);

對於樣品的跨度，這個代碼給出了這樣的結果在控制檯：

4 
[ ["45", "16"], ["46", "10"], ["47", "11"], ["48", "5"] ]

來源

2013-07-01 22:34:53

感謝您的解釋。我喜歡這個代碼，它與我開始的最接近。我將不得不在第二和第三個要點中搜索更多關於你所說的內容的細節。順便說一下，這些跨度不是我的代碼，所以我只是發佈什麼從原始網站。其餘的代碼看起來不太好。：）再次感謝。 – pedwards

不客氣，樂意效勞。我知道這些跨度不是你的（我經常使用Greasemonkey標籤），但是無效的代碼經常更改/修復，所以如果你的腳本更多地依賴* valid *部分，你的代碼會更長時間地適應頁面。 :) –

有關更多詳細信息，我用[.map（）'參考]（http://www.jqapi.com/#p=map）鏈接更新了答案。 –

使用此：「和跨度的文本‘

atr = $(this).attr('name');

來源

2013-07-01 19:20:51 YD1m

’。有跡象表明，我從這些元素需要兩個值，我需要後自帶數字」 spnMX

<span>元素不允許name屬性btw。

鑑於你的ID是完全一樣的，因爲每個名字，你可以使用以下命令：

$("span[id^=spnMX]").each(function(){ 
    var text = this.innerHTML; 
    // Returns 16, 10, 11, 5. The text inside each <span>. 
    var idNum = this.id.match(/[\d]+$/)[0]; 
    // Returns 45, 46, 47, 48. The parts of each ID after spnMX. 
});

現在你這些變量，你會發現你的任務其餘精細:)

jsFiddle here.

來源

2013-07-01 19:27:55 lifetimes

謝謝。我還沒有嘗試過每個功能，但很高興看到它將如何完成。 – pedwards

如何使用jQuery從SPAN元素中提取名稱屬性？

回答

相關問題