通过使用JavaScript

查找内容删除表行我有这样的代码：通过使用JavaScript

<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或用于识别的类别。有没有办法通过搜索“状态：”或名称=“状态”的JavaScript删除行仅用于Firefox（用于Greasemonkey）？

我不能使用jQuery和我不能编辑代码设置任何标识的

问候 bernte

来源

2012-11-28 bernte

请问'要经常清除tr'标签是第二个？另外，你如何在这个标记中找到'table'元素？ – wsanville

另外，您需要支持哪些浏览器？ – wsanville

TR标签也可以是第5 ..我用它在Greasemonkey中仅用于Firefox – bernte

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-28 20:05:19 lostsource

你的脚本工作正常..但我有4个HTML页面和一个不同功能的greasemonkeyscript！现场一个与状态表都工作完美！在网站2没有状态表我收到一个错误cells [x] .firstChild为null ..任何想法？ – bernte

请检查更新后的答案，当表格中包含“空”单元格时可能会出现该错误 – lostsource

YEPP！这是完美的！非常感谢你！ – bernte

如果你不能承受是与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); 
    } 
}

Demonstration

为了与IE7兼容，你可能不得不遍历所有行和单元格，这将不太慢，但不太清楚。

请注意，我使用了IE8上不存在的trim。为了让这个浏览器上工作，如果需要的话，你或许会添加通常的处理办法（从MDN）：

if(!String.prototype.trim) { 
    String.prototype.trim = function() { 
    return this.replace(/^\s+|\s+$/g,''); 
    }; 
}

来源

2012-11-28 20:03:54

由于'.trim（）'这与IE8和更低版本不兼容，并且与任何版本的Firefox因为'.innerText'。 –

+1修复。我个人把'.textContent'放在'.innerText'之前只是因为它符合标准，但它显然会以任何方式工作。 –

我会相应地改变它。但是在这个非常精确的话题中，我并不明白为什么标准化名称是textContent。只是有一次，似乎微软选择了一个相关的名字...... –

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-28 20:07:11

我认为document.evaluate在IE上不存在，甚至IE10。 –

该死的你IE！（握拳） –

如果你想与旧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 Fiddle demo。

来源

2012-11-28 20:07:15

简单地使用这个

var gettag =document.getElementsByTagName("tr")[3] ; // the third tag of tr 
     document.removeChild(gettag);

来源

2012-11-28 20:15:11

通过使用JavaScript

回答

相关问题