Question

我有以下html表 -

<table cellpadding=0 cellspacing=0><tr><td height=\'30\' bgcolor=\'#CCCACA\'>
<font size=2 face=\'Arial\' color=\'#000000\'><b>&nbsp;Property</b></font>
</td><td bgcolor=\'#CCCACA\'>
<font size=2 face=\'Arial\' color=\'#000000\'><b>&nbsp;Value</b></font>
</td></tr><tr><td bgcolor=\'white\' width=\'200\' height=\'20\'>
<font size=2 face=\'Arial\'>&nbsp;First Name</font>
</td><td bgcolor=\'white\' width=\'300\'>
<font size=2 face=\'Arial\'>&nbsp;John</font>
</td></tr><tr><td bgcolor=\'#F3EFEF\' width=\'200\' height=\'20\'>
<font size=2 face=\'Arial\'>&nbsp;Contact</font>
</td><td bgcolor=\'#F3EFEF\' width=\'300\'>
<font size=2 face=\'Arial\'>&nbsp;number</font>
</td></tr><tr><td bgcolor=\'white\' width=\'200\' height=\'20\'>
<font size=2 face=\'Arial\'>&nbsp;Last Name</font>
</td><td bgcolor=\'white\' width=\'300\'><font size=2 face=\'Arial\'>&nbsp;Smith</font>
</td></tr></tr></table>

我希望在Javascript中使用正则表达式从此代码中提取number值。我的问题是在表格中的每个值之前的代码行 -

<font size=2 face=\'Arial\'>&nbsp;

存在因此我无法本地化为一个值。但是我知道number值将在上述行的每个第6个实例之后发生。我知道正则表达式可以在&nbsp之后提取值，但不知道如何 1。实现这个和 2。获取第6个值。< / p>

修改

function showProperties2(){

var itemID = new String(objChart.getSelectedElements());
var props = new String(objChart.getItemsPropertyIDs(itemID));
var arrPropIDs = props.split(',');
var propertyHTML="<table cellpadding=0 cellspacing=0><tr><td height='30' bgcolor='#CCCACA'><font size=2 face='Arial' color='#000000'><b>&nbsp;Property</b></font></td><td bgcolor='#CCCACA'><font size=2 face='Arial' color='#000000'><b>&nbsp;Value</b></font></td></tr>";
var bgcolor="#F3EFEF";
var i=0;
for(i=0;i<arrPropIDs.length;i++){
    if(objChart.getPropertyValue(itemID, arrPropIDs[i])!=""){
        if(bgcolor=="#F3EFEF"){
            bgcolor = "white";
        }else{
            bgcolor = "#F3EFEF";
        }
        propertyHTML+="<tr><td bgcolor='"+bgcolor+"' width='200' height='20'>";
        propertyHTML+= "<font size=2 face='Arial' class='quack'>&nbsp;"+objChart.getPropertyDisplayName(itemID, arrPropIDs[i])+"</font>";
        propertyHTML+="</td><td bgcolor='"+bgcolor+"' width='300'>";
        propertyHTML+= "<font size=2 face='Arial' class='quack2'>&nbsp;"+objChart.getPropertyValue(itemID, arrPropIDs[i])+"</font>";
        propertyHTML+="</td></tr>";
    }
}
propertyHTML+="</tr></table>";
propertyWindow(propertyHTML, "Properties");


}

以前就是我如何构建我的表格。

Answer 1

如果你不介意使用jQuery，这可能会起作用

function getNumber(table) {
    // Set the variable, tableNumber to an error message of sorts
    var tableNumber = "No number found";
    // Loop through all cells
    $(table + ' td').each(function(){
        $(this).css('background', 'red');
        // Tell if a cell contains the text, '&nbsp;Contact'
        if ($(this).text().indexOf('Contact') != -1) {
            // set the variable tableNumber to the text of the next cell
            tableNumber = $(this).next().text();

        }
    });
        return tableNumber;


}

var report = getNumber('#number-table'); //for debugging

alert(report); //for debugging

然后调用函数如getNumber（$（'＃table-id'））或getNumber（$（'table'））如果没有id并且页面上只有一个表。

jsFiddle：http://jsfiddle.net/5Ggnz/1/

Answer 2

如果格式化得很好，解析任何HTML文档的麻烦都会少得多。首先，您应该阅读HTML和CSS。使用W3C validator查看代码格式化方式的错误＆amp;你能做些什么不同的事情。您应该能够通过分离样式和格式来使HTML更加清晰，如下所示：

<table cellpadding="0" cellspacing="0">
     <tr class="odd">
         <th>Property</th>
         <th>Value</th>
     </tr>
     <tr class="even">
          <td>First Name</td>
          <td>John</td>
     </tr>
     <tr class="odd">
          <td>Contact</td>
          <td>number</td>
     </tr>
     <tr class="even">
          <td>Last Name</td>
          <td>Smith</td>
     </tr>
</table>

<style>
    td {
        color: #000;
        font: Arial;
        font-size: 0.8em;
        height: 20px;
        width: 300px;
        padding-left: 5px;
    }

    th {
        background-color: #CCCACA;
        font-size: 0.8em;
        height: 30px;
        text-align: left;
        padding-left: 5px;
    }

    .even td {
        background-color: white;
    }

    .odd td {
        background-color: #F3EFEF;
    }

    tr td:first-child {
        width: 200px;
    }
</style>

（目前，即使你指定了灰色阴影，桌子也会以蓝色和绿松石呈现给我，因为你已经逃脱了。）

然后，定位表格中每个“数字”单元格的最简单方法是给它们一个独特的类：

<tr>
    <td>Contact</td>
    <td class="phoneNumber">(01) 234 5678</td>
</tr>

然后，您可以使用document.getElementsByClassName("phoneNumber")在JavaScript中进行定位，或者如果您使用的是jQuery：$(".phoneNumber")。

从Html中提取特定值

2 个答案: