0

我想使用javascript删除一些html标签，如td和href 。数据是一个 ajax 返回的表数据，我想在浏览器页面的 div 上显示之前对其执行这些操作。
1.我想删除表格的第 4 列和第 5 列（即 Stamps 和 Status）
2.我还想从表格行的第一列中删除 'a href' 标记（连同它包含的 javascript），所以只有“Sukhvinder Singh GUJRAL”会留在那里。

这是代码

标题是：

<table width=0 border=1 cellspacing=0 cellpadding=1><font>
<tr bgcolor=silver align=center>
<th><font style="font-size: 10pt">Name</th>
<th width=60><font style="font-size: 9pt">Entry<br>info</th>
<th width=40><font style="font-size: 9pt">Instant Messaging</th>
<th width=30><font style="font-size: 9pt">Stamps</th>
<th width=40><font style="font-size: 9pt">Status</th>
</tr>

表中只有一行，但我给出了该行的示例：

<tr bgcolor="#FFFFFF" align=center>
<td align=left><font><a href="javascript:ed_fct('st-eduid%3Ded243547%2Cou%3Dpeople%2Cdc%3Dst%2Cdc%3Dcom')" onmouseover="return true" onmouseout="return true">Sukhvinder Singh GUJRAL</a>
</td>
<td align=center>
<font>&nbsp;<font style="font-size: 8pt">ST person</font>
</td>
<td align=center>
<font color=red>N/A</font>
</td>
<td align=center>
<font><a href="javascript:usm_fct('./Stamping_View/user_stamping_view.php','st-eduid%3Ded243547%2Cou%3Dpeople%2Cdc%3Dst%2Cdc%3Dcom')" onmouseover="return true" onmouseout="return true">stamp</a>
</td>
<td align=center>
<font><font style="color: green">Active</td>
</tr>
</table>
4

3 回答 3

1

像下面这样尝试它会帮助你..

小提琴示例：http: //jsfiddle.net/RYh7U/125/

我已将 ID 分配给表格tblinfo

查询：

你有 5 列，所以我Slice()用来删除最后两列（4 和 5）。

$(document).ready(function() {
  $("#tblinfo th").slice(-2).remove();
  $("#tblinfo td").slice(-2).remove();
   $('#tblinfo td a').each(function(){
    $(this).contents().unwrap();
   });
});

如果您不想要表 ID ，请tblinfo尝试如下

小提琴示例：http: //jsfiddle.net/RYh7U/126/

$(document).ready(function() {
  $("th").slice(-2).remove();
  $("td").slice(-2).remove();
  $('td a').each(function(){
  $(this).contents().unwrap();
  });
});
于 2013-04-09T12:29:38.747 回答
0

检查以下 JS fiddle 以获得答案。

http://jsfiddle.net/JLVML/

您可以使用以下代码删除锚标签

$("a").replaceWith($("a").text());

希望这对您有所帮助。

于 2013-04-09T12:29:24.120 回答
0

我假设您正在回调或其他什么，这xhr是对XMLHttpRequest对象的引用。这里的诀窍是我们创建了一个临时分离的div元素，并将它的innerHTML属性设置为xhr.responseText. 然后我们修改内存中的元素，这样就不会导致多次 DOM 回流。http://jsfiddle.net/S7uK2/

var tempEl = document.createElement('div'),
    textNode = document.createTextNode(),
    els, i, el;

tempEl.innerHTML = xhr.responseText;

//remove a tag
el = tempEl.querySelector('td:first-child a');
textNode.nodeValue = el.innerText;
el.parentNode.replaceChild(textNode, el);

//remove other elements
els = tempEl.querySelectorAll('th:nth-child(n+4), td:nth-child(n+4)');
i = els.length - 1;

while (i >= 0) {
    el = els[i];
    el.parentNode.removeChild(el);
    i--;
}

此时，tempEl.innerHTML包含清理过的表格标记，您可以使用它在DOM.

于 2013-04-09T12:39:54.937 回答