Javascript：創建不會繼承css的元素？

我正在爲學校製作一個簡單的greasemonkey腳本，其中添加了一個醜陋的黃色框，其中包含一些指向所有網站的鏈接。目前我只是這樣做：Javascript：創建不會繼承css的元素？

var guesses_div = document.createElement("div"); 
guesses_div.style.position = "fixed"; 
guesses_div.style.right = "0"; 
guesses_div.style.bottom = "0"; 
guesses_div.style.backgroundColor = "rgb(255, 255, 0)" 
// here I add some links to the "guesses_div"

此代碼工作正常。但是，它從它所在的網頁中繼承了樣式。有沒有辦法來防止這種情況？除了逐個重寫所有樣式元素？

謝謝！

來源

2016-04-15 The Oddler

如果你的css被寫成包含所有元素，那麼要麼重新編寫css來減少包容性，要麼覆蓋所有的樣式。就是這樣 – ne1410s

問題是我沒有寫css。它被添加到所有網站，而不僅僅是我自己的網站。所以我不能改變CSS。 –

看起來像它的選項＃2然後我害怕：手動unpicking/restyling繼承的東西。我不太瞭解'iframes'，但我知道他們不會拿起父母的CSS，所以也許這是一個選擇。就像我說的，雖然我不太瞭解 – ne1410s

簡答題：不。沒有辦法阻止繼承的CSS。

長答案：是的。您應該手動覆蓋繼承的CSS規則。

來源

2016-04-15 11:13:26

不知道它是否是最好的做法，但在html5中，您可以使用一切接近標籤名稱 - 所以不要讓你的div繼承div的網站css規則，只是不要創建一個div，但myDiv例如

var guesses_div = document.createElement("myDiv"); 
guesses_div.style.position = "fixed"; 
guesses_div.style.right = "0"; 
guesses_div.style.bottom = "0"; 
guesses_div.style.backgroundColor = "rgb(255, 255, 0)"

FIDDLE

來源

2016-04-15 11:15:56 baao

如何插入iframe代替div？ iframe將不會繼承其父項的樣式。

如果有疑問該怎麼辦，請參考this的問題。

來源

2016-04-15 11:26:21 glu

你可以看着all屬性，這樣做：

var guesses_div = document.createElement("div"); 
guesses_div.style.all = "unset"; 
guesses_div.style.position = "fixed"; 
guesses_div.style.right = "0"; 
guesses_div.style.bottom = "0"; 
guesses_div.style.backgroundColor = "rgb(255, 255, 0)";

不幸的是，這並不在IE或Safari工作還沒有，但你使用的Greasemonkey（僅適用於Firefox，我相信），你應該沒問題。

來源

2016-04-15 11:26:28 markmoxx

Javascript：創建不會繼承css的元素？

回答

相關問題