使用JavaScript刪除一些HTML標簽

Question

我想使用javascript刪除一些html標簽，例如td和href 。 該數據是ajax返回的表數據，我要對其執行這些操作，然后再將其顯示在瀏覽器頁面的div上。
1.我要刪除表格的第4列和第5列（即圖章和狀態）
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>

Answer 1

嘗試如下所示，它將對您有所幫助。

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

我已將ID作為tblinfo賦予表

jQuery的：

您有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();
  });
});

Answer 2

檢查以下JS小提琴以獲得答案。

http://jsfiddle.net/JLVML/

您可以使用以下代碼刪除定位標記

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

希望這對您有所幫助。

Answer 3

我假設您處於回調之類，並且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顯示表。