使用AJAX和Extract Specific Cells解析从ASP页面返回的HTML表

时间:2011-11-01 22:26:23

标签: javascript asp.net html ajax

工作内部网上有一个ASP页面,可以从众多传感器返回数据。数据以表格形式显示,包含多个行和列。

如果我能在部门网站上显示一些输出,我觉得这很酷。

我想使用ajax打开ASP页面并从结果表中获取一些数据点。

使用AJAX打开页面很简单,但我不知道在那之后如何处理它。

表的格式如下:

<table>
  <tr>
    <td>Data ID 1</td>
    <td>Description</td>
    <td>Data</td>
  </tr>
  <tr>
    <td>Data ID 2</td>
    <td>Description</td>
    <td>Data</td>
  </tr>
</table>

每行中的第一个单元格是唯一ID,然后同一行中的第5列具有我想要的值。

function loadXMLDoc()
{
    var xmlhttp;

    if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200) {
            document.getElementById("testDiv").innerHTML=xmlhttp.responseText;
        }
    }

    xmlhttp.open("GET","http://plantdata/showData.asp",true);
    xmlhttp.send();
}

如何通过唯一ID获取数据?

3 个答案:

答案 0 :(得分:3)

xmlhttp.onreadystatechange=function() {
  if (xmlhttp.readyState==4 && xmlhttp.status==200) {
    var target = document.getElementById("testDiv");
    target.innerHTML = xmlhttp.responseText;
    extractIDs(target);
  }
}

function extractIDs(container) {
  var trs = container.getElementsByTagName("TR");

  for (var i=0; i<trs.length; i++) {
    var tds = trs[i].getElementsByTagName("TD"),
        txt = tds[0].textContent || tds[0].innerText;  // innerText for IE

    alert("row " + (i+1) + ": " + txt);
  } 
};

答案 1 :(得分:2)

这肯定是jQuery的工作。我可以看到输出,然后我会告诉你答案,但它是这样的:

$(document).ready(function () {
        $.ajax({
            url: "TableData.html",
            type: "GET",
            success: function (data) {
                var tempData = $(data);
                //alert(tempData.html());

                tempData.find("tr td[id]").each(function (i) {
                    alert($(this).siblings(":nth-child(5n)").text());
                });
            }
        });
    });

答案 2 :(得分:1)

遍历表格的行:

var data;
var rows=document.getElementById("testDiv").getElementsByTagName('table')[0].rows;
for(var i=0; i<rows.length; ++i)
{
    var cells=rows[i].cells;
    if(cells[0].innerHTML == uniqueID)
    {
        data=cells[4].innerHTML;
        break;
    }
}