使用jQuery解析HTML

我是學習Jquery的新手。我想解析HTML字符串：使用jQuery解析HTML

<tr> 
    <td class="first"><b><a href="/q?s=TOM">TOM</a></b></td> 
    <td class="second name">Tom is a good boy</td> 
    <td class="last_trade"><b><span id="yfs_l10_TOM">5.45</span></b> <nobr><span id="yfs_t10_TOM">Sep 9</span></nobr></td> 
    <td><span id="yfs_c10_TOM"><width="10" height="14" border="0" src="abcdefgh" alt="Down"> <b style="color:#cc0000;">14.49</b></span> <span id="yfs_p20_TOM"><b style="color:#cc0000;"> (72.67%)</b></span></td> 
    <td><span id="yfs_v00_TOM">4,100</span></td> 
    <td class="last"><a href="https://stackoverflow.com/q/bc?s=TOM">Chart</a>, <a href="/q?s=TOM">More</a></td> 
</tr>

上面的字符串重複使用的HTML 不同值的10倍我想要得到的值：TOM，5.45，14.49，72.67％，4,100所有10個repititions HTML中的類似字符串。

來源

2011-09-12 Shilpi Gautam

你試過了什麼？ – Candide

如果'string.split（）'不足以滿足您的需求，您可能需要使用正則表達式和'string.match（）'。（這些都是普通的JavaScript方法，而不是jQuery） – Blazemonger

每個建議使用正則表達式的人都會得到一個指向[RegEx match open tags（XHTML self-contained tags除外）]的鏈接（http://stackoverflow.com/questions/1732348/regex -match開放標籤，除了-XHTML-自足標籤）。 Shilpi Gautam，如果你想通過解析HTML來學習jQuery，我建議以另一種方式嘗試，jQuery並不是真正意義上的解析HTML，並且它不是一個很好的練習。 – Albireo

使用JavaScript的正則表達式（又名正則表達式）：

var data = "TOMTom is a good boy5.45 Sep 9 14.49 (72.67%)4,100Chart, More"; 
var regex = /^(.+)Tom is a good boy([0-9\.]+) [^\s]+ [0-9]+ ([0-9\.]+) \(([0-9,]+)%\)([0-9\.]+)/ 
var extracted_data = data.match(regex); 
alert(extracted_data[0]); 
alert(extracted_data[1]); 
alert(extracted_data[2]); 
alert(extracted_data[3]);

來源

2011-09-12 15:59:50

好吧，這個問題改變了，因此我的回答將不是一個適當的答案。如果你需要解析一個字符串，而不是DOM，這是一個解決方案。 –

您可以通過與each錶行中循環，並通過類搶值。

$("#table1 tr").each(function() 
{ 
    $this = $(this); 
    var firstName = $this.find(".first").text(); 
    var secondName = $this.find(".second").text(); 
    // ... 
});

來源

2011-09-12 16:08:15 jrummell

Here is a working sample我創建，以幫助您使用您需要的jQuery選擇。 jQuery代碼迴路每個tr：

var results = []; 

$("table tr").each(function(i) { 
    results[i] = { 
     firstName: $("td.first", this).text(), 
     lastTrade: $("td.last_trade span:first", this).text(), 
     down: $("td.last_trade", this).next("td").find("span:first").text(), 
     downPercentage: $("td.last_trade", this).next("td").find("span:last").text(), 
     someOtherNumber: $("td.last", this).prev("td").text() 
    }; 
});

根據您的需求，您必須更改屬性名稱，並使用results。

來源

2011-09-12 16:14:20

非常簡潔比我更乾淨的方式，這對我來說是一個非常好的教訓;-) – gordatron

基於新的問題...

我個人將創建一個對象來存儲數據的每一行中：一旦頁面加載例如

pupil = function() { 
     this.name; 
     this.score; 
     this.dob; 
     //..etc 
    }

然後填充數組：

$(function() { 
     var pupils = []; 
     $('table').find('tr').each(function (x, d) { 
      temp = new pupil(); 
      temp.name = $(d).find('.first').find('a').html(); 
      //...etc... 
     }); 
    });

來源

2011-09-12 16:15:45 gordatron

使用ErickPetru的答案更好，它只是教會我一個更好的方式做到這一點;-) – gordatron

也注意到他使用文本的HTML ...好多了;-) – gordatron

使用jQuery解析HTML

回答

相關問題