使用JavaScript將CSS屬性添加到包含CSS樣式的特定范圍

Question

我有類似的東西

<span style="font-size: 1.7px; letter-spacing: -1.7px; color: #edf6fc">text</span>

和

<span style="font-size: 99.81%; color: #080007">text </span>

我如何選擇第一個並添加; 讓我們說display: none到它的樣式（或刪除那個span）但不是第二個使用JavaScript。

或者如何刪除具有CSS屬性letter-spacing所有范圍？

Answer 1

為這些元素提供class或id 。

.spanOne{
    display: none;
}

要么

動態創建這些元素並將它們存儲在變量中。 然后，您可以使用這些變量來添加或刪除屬性。

var spanOne = //code to create span element;
var spanTwo = //code to create another span element;

$(spanOne).hide();

要么

$('#parentElementID').children('span').eq(0).hide();

更新 ：

$('div').children('span').filter(function () {
    return this.style.fontSize == "17.7px";  //in your case 1.7px
}).eq(0).css('backgroundColor', 'red');

PS：我建議在該元素中添加一個類名或id。

Answer 2

一種簡單的方法是添加class名或id ：

<span id="iHateYou" style="font-size: 1.7px; letter-spacing: -1.7px; color: #edf6fc">text</span>
<span style="font-size: 99.81%; color: #080007">text </span>

和js：

document.getElementById('iHateYou').remove();

Answer 3

例如在Firefox中使用類似Firebug的添加，右鍵單擊問題標簽，例如<span>然后選擇inspect元素。 轉到代碼並找到具有唯一標識符（ID）的父代碼，選擇該父代表並通過父代子選擇添加CSS。

例如，

#abc span{display: none;}

在樣式表中添加它。 這將使唯一標識符的子項附加您的樣式並覆蓋應用於它的樣式。