選擇ul li層次結構中td的所有innerHTML

Question

我有一個html結構，如下所示：

<ul id='abc'>
    <li>
        <table>
            <tbody>
                <tr>
                    <td>
                        A
                    </td>
                </tr>
            </tbody>
        </table>
    </li>
    <li>
        <table>
            <tbody>
                <tr>
                    <td>
                        B
                    </td>
                </tr>
            </tbody>
        </table>
    </li>       
    ...
    ...
</ul>

我想使用jquery將A，B，C ...值存儲在數組中。請幫助...

Answer 1

您可以使用$.fn.map()

將數組或對象中的所有項目轉換為新的項目數組。

var arr = $('#abc td').map(function(){
    return $(this).text();
}).get();

Answer 2

您可以通過The Javascript執行此操作

Element.getElementsByTagName()方法返回具有給定標記名稱的實時HTMLCollection元素

var values = []
var tableUl = document.getElementById("abc"); 
var cells = tableUl.getElementsByTagName("td"); 
for (var i = 0; i < cells.length; i++) { 
    values.push( cells[i].textContent.trim()); 

}

小提琴

Answer 3

這是您想要的：

var values = [];
$('ul li').find('td').each(function() {
  values.push($(this).html());
});

Answer 4

這應該工作：

var values = $('ul#abc td').map(function() { return $(this).text(); });

Answer 5

嘗試利用.text() ， String.prototype.match()

 var res = $("#abc td").text().match(/\\w+/gi) console.log(res) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> <ul id='abc'> <li> <table> <tbody> <tr> <td> A </td> </tr> </tbody> </table> </li> <li> <table> <tbody> <tr> <td> B </td> </tr> </tbody> </table> </li> </ul> 

Answer 6

另一種方法是：

$("ul#abc li td:first-child").each(function () {
   //alert($(this).text());
   console.log($(this).text());
 });