javascript - 在表格单元格中查找单词,然后从下一个单元格中提取文本

标签 javascript jquery json

请看这个 Fiddle example 。我正在使用 ajax 脚本来解析 JSON 文件。 JSON 文件中的一项(B 项)在其表格中包含单词“Sodium”,我可以使用此脚本打印表格:

$.ajax({
    url: "url.json",
    success: function (data) {

        $(data.query.results.json.json).each(function (index, item) {         
         var title = item.title;
         var table = item.table; 
            if (table.indexOf("Sodium") >= 0){
         $('.'+ title+'table').html(''+table+'')
            }
        });
    },
    error: function () {}
});

既然它能在表中找到“钠”这个词,我想知道是否有可能找到哪个 td这个词在然后找到它的下一个最接近的 td提取钠量,在本例中为 1200 mg ?会像.closest('td').text();吗?工作?但是如何选择选择器呢?

JSON 文件

[{"title":"A","table":"<table class=\"tablesorter\"><thead><tr><td >Ingredient<\/td><td >Amount<\/td><td>% Daily Value**<\/td><\/tr><\/thead><tbody><tr><td>Calories<\/td><td>10<\/td><td>&nbsp;<\/td><\/tr><tr><td>Total Carbohydrate<\/td><td>2g<\/td><td>&lt;1<\/td><\/tr><tr><td>Vitamin C<\/td><td>110mg<\/td><td>4<\/td><\/tr><tr><td>Potassium<\/td><td>235mg<\/td><td>6<\/td><\/tr><tr><td>Omega 6<\/td><td>1100mg<\/td><td>*<\/td><\/tr><tr><td>Vitamin B<\/td><td>1200mg<\/td><td>*<\/td><\/tr><tr><td>Vitamin E<\/td><td>300mg<\/td><td>*<\/td><\/tr><\/tbody><\/table>"},{"title":"B","table":"<table class=\"tablesorter\"><thead><tr><td >Ingredient<\/td><td >Amount<\/td><td>% Daily Value**<\/td><\/tr><\/thead><tbody><tr><td>Calories<\/td><td>10<\/td><td>&nbsp;<\/td><\/tr><tr><td>Total Carbohydrate<\/td><td>2g<\/td><td>&lt;1<\/td><\/tr><tr><td>Vitamin C<\/td><td>110mg<\/td><td>4<\/td><\/tr><tr><td>Potassium<\/td><td>245mg<\/td><td>6<\/td><\/tr><tr><td>Fish Oil<\/td><td>1100mg<\/td><td>*<\/td><\/tr><tr><td>Sodium (from Kitchen Salt)<\/td><td>1200mg<\/td><td>*<\/td><\/tr><tr><td>Vitamin E<\/td><td>300mg<\/td><td>*<\/td><\/tr><\/tbody><\/table>"}]

表结构:

<table class="tablesorter">
<thead>
<tr>
<td>Ingredient</td>
<td>Amount</td>
<td>% Daily Value**</td>
</tr>
</thead>
<tbody>
<tr>
<td>Calories</td>
<td>10</td>
<td></td>
</tr>
<tr>
<td>Total Carbohydrate</td>
<td>2g</td>
<td>&lt;1</td>
</tr>
<tr>
<td>Vitamin C</td>
<td>110mg</td>
<td>4</td>
</tr>
<tr>  //************************
<td>Sodium (from Kitchen Salt)</td>
<td>1200mg</td>
<td>6</td>
</tr>  //*************************
<tr>
<td>Omega 6</td>
<td>1100mg</td>
<td>*</td>
</tr>
<tr>
<td>Vitamin B</td>
<td>1200mg</td>
<td>*</td>
</tr>
<tr>
<td>Vitamin E</td>
<td>300mg</td>
<td>*</td>
</tr>
</tbody>
</table>

最佳答案

您可以使用 jQuery :contains() 选择器简单地搜索已解析的 HTML:

$.ajax({
    url: "url.json",
    success: function (data) {

        $(data.query.results.json.json).each(function (index, item) {         
            var title = item.title;
            var table = item.table; 
            if (table.indexOf("Sodium") >= 0) {
                $('.'+ title+'table').html(''+table+'');
                alert($('.'+title+'table').find('td:contains(Sodium)').next().html());
            }
        });
    },
    error: function () {}
});

Demo .

该警报调用将在其文本中包含 Sodium 的内容之后提醒 td 的内容。

关于javascript - 在表格单元格中查找单词,然后从下一个单元格中提取文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23837258/

相关文章:

javascript - jquery调整大小后元素高度不更新

jquery - 后拉伸(stretch)图像未出现

java - 有没有办法使用 TypeAdapter 来序列化父类和子类实例

php - 添加将在 PHP 中以 JSON 编码的 mysql 查询结果的值?

javascript - 从json字符串中提取数据

javascript - 表单提交事件上的 ajax POST 无法正常工作

Javascript 测试 - 使用特定参数调用的函数

setInterval 函数中的 Javascript location.reload() 未按预期工作

javascript - JQuery Tablesorter 不是函数

javascript - 在相同的结构中找到下一个文本区域