1

我有这个代码:

<table>
    <tbody>
        <tr>
            <td align="left">X</td>
            <td>X1</td>     
        </tr>
        <tr>        
            <td width="150" align="left">Y</td>
            <td>Y1</td>
        </tr>
        <tr>    
            <td align="left">Status: </td>
            <td colspan="4">
                <select name="status" size="1">
                    <option selected="selected" value="2">one</option>
                    <option value="1">two</option>
                </select>                   
            </td>
        </tr>
        <tr>        
            <td width="150" align="left">Z</td>
            <td>Z1</td>
        </tr>   
    </tbody>
</table>

并想用 Javascript 删除这一行:

<tr>    
    <td align="left">Status: </td>
    <td colspan="4">
        <select name="status" size="1">
            <option selected="selected" value="2">one</option>
            <option value="1">two</option>
        </select>                   
    </td>
</tr>

问题是我没有任何 id 或类用于识别。有没有办法通过仅用于 Firefox 的 javascript 搜索“状态:”或 name="status"(将其用于 Greasemonkey)来删除该行?

我不能使用 jQuery,也不能编辑代码来设置任何 id

最好的问候伯恩特

4

5 回答 5

5

如果你负担得起不兼容 IE7,你可以这样做:

​var elements = document.querySelectorAll('td[align="left"]');
for (var i=0; i<elements.length; i++) {
    var text = elements[i].textContent || elements[i].innerText;
    if (text.trim()=='Status:') {
       elements[i].parentNode.parentNode.removeChild(elements[i].parentNode);   
    }
}

示范

为了与 IE7 兼容,您可能必须对所有行和单元格进行迭代,这并不会真正变慢,但会不太清楚。

请注意,我使用trim了 IE8 上不存在的。如果需要,要让它在这个浏览器上工作,你可以添加这个通常的修复(来自MDN):

if(!String.prototype.trim) {
  String.prototype.trim = function () {
    return this.replace(/^\s+|\s+$/g,'');
  };
}
于 2012-11-28T20:03:54.407 回答
3
function removeRowByCellValue(table,cellValue) {
    var cells = table.getElementsByTagName("TD");
    for(var x = 0; x < cells.length; x++) {

        // check if cell has a childNode, prevent errors
        if(!cells[x].firstChild) {
            continue;
        }

        if(cells[x].firstChild.nodeValue == cellValue) {
            var row = cells[x].parentNode;
            row.parentNode.removeChild(row);
            break;
        }
    }
}

首先获取对您的表格的引用,因为您没有可以使用的 ID getElementsByTagName..(这里我假设它是您文档中的第一个表格)

var myTable = document.getElementsByTagName("table")[0];

然后您可以使用以下参数调用该函数

removeRowByCellValue(myTable,"Status: ");
于 2012-11-28T20:05:19.090 回答
1
var xpathResult = document.evaluate("//td[starts-with(.,'Status:')]", document.body, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
var element = xpathResult.singleNodeValue.parentNode;
while (element.firstChild)
  element.removeChild(element.firstChild);

jsbin http://jsbin.com/urehuw/1/edit

于 2012-11-28T20:07:11.173 回答
1

如果您想与旧版 IE 兼容:

function closest(el, tag) {
    if (!el || !tag) {
        return false;
    }
    else {
        return el.parentNode.tagName.toLowerCase() == tag ? el.parentNode : closest(el.parentNode, tag);
    }
}

// gets all 'select' elements
var sel = document.getElementsByTagName('select');

// iterates through the found 'select' elements
for (var i=0, len = sel.length; i<len; i++) {
    // if the 'select' has the name of 'status'
    if (sel[i].name == 'status') {
        // uses the closest() function to find the ancestor 'tr' element
        var row = closest(sel[i], 'tr');
        // access the 'tr' element's parent to remove the 'tr' child
        row.parentNode.removeChild(row);
    }
}

JS 小提琴演示

于 2012-11-28T20:07:15.897 回答
0

只需使用这个

    var gettag =document.getElementsByTagName("tr")[3] ; // the third tag of tr
         document.removeChild(gettag);
于 2012-11-28T20:15:11.640 回答