簡體   English   中英

JavaScript刪除某些標簽之間的所有內容

[英]JavaScript remove all content between some tags

我想僅使用JavaScript刪除兩個標簽之間的所有內容(不使用jQuery或類似的東西)。 另外,我無法修改要刪除的內容。

例如下面的代碼:

<body>
<p>Remove me</p>
<a href="#">Me too</p>
<img src="But don't me!"/>
(...)

我想刪除<body><img/>之間的所有內容。

您可以使用如下形式:

var children = document.body.childNodes;

for(var i = 0; i < children.length; i++)
{
    if(children[i].tagName == 'IMG')
        break;

    document.body.removeChild(children[i]);
}

嘗試一下,它應該可以工作,但這是一個嚴格的示例,它與示例代碼中的結構完全相同。 通常,您會獲得要刪除的內容的父元素。 然后一一刪除標簽,直到您點擊了不想刪除的標簽。 這可能有效,但我不建議您-將內容包裝在div或類似的內容中,然后僅刪除一個標簽。 為您和可能需要看一下代碼的其他人,使事情變得簡單得多。

由於您無法修改HTML或使用庫,因此可以嘗試使用getElementsByTagName檢索節點

  • getElementsByTagName(“ p”)[0]
  • getElementsByTagName(“ a”)[0]

然后,這取決於您是否希望它們仍保留在標簽中,但沒有內容,或者是否也要除去標簽。 如果您要刪除內容,但由於某種原因保留了空節點,請嘗試設置

  • var aNode = document.getElementsByTagName('a')[0];
  • aNode.innerHtml =“”;

如果要刪除完整的節點,請執行上述操作:

  • var pNode = document.getElementsByTagName('p')[0];
  • pNode.parentNode.removeChild(pNode);

當然,您必須注意DOM將來不會更改,因為這可能會破壞解決方案。

根據前提:

我想僅使用JavaScript刪除兩個標簽之間的所有內容(不使用jQuery或類似的東西)。

和上面的評論:

還可以說我無法修改內容

如果您不能將id添加到元素中或將它們包裝在某個容器中,則可以看到兩種解決方案。

  • 使用getElementByTagName()定位img-tag,然后刪除之前的所有子節點。
  • 使用document.removeChild()並使用固定的子節點索引(如果項目的索引是固定的)

兩種解決方案都嚴重依賴於將來不會更改的DOM。 我強烈建議使用jQuery或其他框架來簡化操作(並兼容跨瀏覽器)。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM