我可以在Javascript中同時爲多個屬性分配一個變量值嗎？

假設我想將一個樣式元素的水平填充設置爲變量'x'並將垂直設置爲一個變量'y'。當然，這是可能的：我可以在Javascript中同時爲多個屬性分配一個變量值嗎？

var docex = document.getElementById.style; 
docex.paddingTop = y; 
docex.paddingBottom = y; 
docex.paddingLeft = x; 
docex.paddingRight = x;

有一個較短的辦法，我要做到這一點，比如一個類似於：

var docex = document.getElementById.style; 
docex.paddingTop = docex.paddingBottom = y; 
docex.paddingLeft = docex.paddingRight = x;

不過，據我瞭解，上述是行不通的並會聲明一個全局變量，就像我從這個網站上的另一個問題看到的那樣。那麼，對於我來說，實現類似於上面的想法的最有效的最小途徑是什麼？

在此先感謝！

來源

2017-01-21 Terrornado

就介紹它接受X，Y的函數，做功能 –

什麼全局變量裏面的東西嗎？ –

你可以爲特定的情況做一些CSS欺騙 - >'document.getElementById（'＃id'）。style.cssText ='padding：'+ x +''+ y;' – japrescott

不過，據我瞭解，上述是行不通的，並會聲明一個全局變量做

它不會。

比較這兩個例子：

var foo = bar = 2;

此：

聲明foo作爲一個局部變量
分配2到bar隱式創建bar作爲一個全球性的，而它確實是
分配bar到foo

obj.foo = obj.bar = 2;

此：

分配2到obj.bar隱式創建bar爲obj屬性，如果它不存在
分配obj.bar到obj.foo隱式創建foo爲obj屬性，如果它不存在

它不會創建一個全球性的，因爲你沒有提到它的變量名稱的任何代碼。

這就是說，因爲你正在改變所有的padding屬性，你可以設置padding速記屬性而不是單獨做四個的。

padding: <top> <right> <bottom> <left>

或

padding: <vertical> <horizontal>

這樣：

docex.padding = y + " " + x;

來源

2017-01-21 13:09:37 Quentin

您可以使用該速記CSS規則：

docex.padding = y + " " + x;

這臺y頂部和底部填充和x爲左，右填充。

MDN Reference

來源

2017-01-21 13:06:00

啊，是的。這在之前並不適用於我，因爲我將它寫爲docex.padding = y + x;沒有引用空間。而我甚至不知道只寫兩個變量就意味着它假定了水平和垂直。非常感謝！ – Terrornado

可以使用style.padding

var x="50px"; 
 
var y="25px"; 
 

 
var ele = document.getElementById('o'); 
 

 
ele.style.padding = y+' '+x;

#o{ 
 
    width:200px; 
 
    height:100px; 
 
    border:1px solid black; 
 
    box-sizing:border-box; 
 
} 
 
#i{ 
 
    width:100px; 
 
    height:50px; 
 
    background:red; 
 
}

<div id="o"> 
 
<div id="i"> 
 
    </div></div>

來源

2017-01-21 13:09:29 ab29007

我可以在Javascript中同時爲多個屬性分配一個變量值嗎？

回答

相關問題