如何使用CSS刪除沒有html標簽的字符串

Question

我需要刪除沒有html標記的字符串。

例如 ：

 <div class="A"> <a href="#" class="link">keep this</a> and i want to remove this </div> 

我可以只使用css嗎？

Answer 1

也許你可以使用font-size ::

 .A { font-size: 0; } .A a { font-size: 20px; } 

 <div class="A"> <a href="#" class="link">keep this</a> and i want to remove this </div> 

Answer 2

你可以使用visibility ：

 .A { visibility: hidden; } .A a { visibility: visible; } 

 <div class="A"> <a href="#" class="link">keep this</a> and i want to remove this </div> 

注意 - 當然這不會從DOM本身中刪除有問題的字符串/元素，它只是隱藏它但實現了相同的目的。

Answer 3

默認情況下，將類“A”內的樣式設置為空白。 設置一個輔助類來處理“.A a”。 這將允許您有兩種不同的樣式。 一個用於錨定，一個用於非錨定。

.A { color: rgba(0, 0, 0, 0.5); }  //Set this to transparent
.A a { color: #000 }

這樣的事情。

Answer 4

您還可以使用display: none和:not()偽選擇器

.A :not(a) {
    display: none;
}

編輯：這不起作用

這也不是：

.A {
    display:none
}

.A a {
    display: inline!important;
}

Answer 5

你不能用純css做到這一點。 如果您無法更改標記，那么您將需要使用JS來獲取要保留的內容並刪除其余內容。

如果您對標記有任何控制權，那么您應該考慮使用不同的標記。 您可以擁有最初隱藏的備用元素。

<div class="A">
    <a href="#" class="link">keep this</a> and i want to remove this
</div>
<div class="A hidden">
    <a href="#" class="link">keep this</a>
</div>

您還可以在span標記中包含要刪除的其他內容，並為其提供一個稍后可以引用的類。

<div class="A">
    <a href="#" class="link">keep this</a> <span class="bad-stuff">and i want to remove this</span>
</div>