我怎樣才能給JavaScript元素一個CSS類？

我有下面的代碼我怎樣才能給JavaScript元素一個CSS類？

var addressPopupMenu = window.createPopup(); 
function showAddressPopup() { 
    var popup = document.getElementById('addressFullSpan'); 

    popupMenuBody = popupMenu.document.body; 
    popupMenuBody.style.backgroundColor = "#336699"; 
    popupMenuBody.style.border = "solid 2px; white"; 
    popupMenuBody.style.fontSize="130%"; 
    popupMenuBody.style.color="white"; 
    popupMenuBody.style.padding="10px"; 
    popupMenuBody.style.paddingLeft="30px";

正如你可以看到我重複popupMenuBody.style。我怎樣才能給popupMenuBody.style一個CSS類，所以我沒有重複這對於每一個彈出

編輯：它不工作

我添加popupMenuBody.className = "popups";

.popups 
    { 
     background-color: #29527A; 
     border: solid 2px; white; 
     fontSize:120%; 
     pcolor:white; 
     padding:10px; 
     paddingLeft:30px; 
     textTransform:capitalize; 
    }

也沒錯，我包括我的頁面中的.css其工作內容其他頁面上的內容

來源

2011-03-07 code511788465541441

驚人，三個建議，所有的OP想要做的是風格的一個元素。 – 2011-03-08 09:48:47

popupMenuBody.className = "class_name";

來源

2011-03-07 11:51:36

它由於某種原因不起作用。 theres沒有現在彈出的樣式 – code511788465541441 2011-03-07 11:58:27

您是否定義了一個CSS規則，其中包含您之後的樣式？ – 2011-03-07 12:00:30

是的，我做的和它的工作很好，在頁面上的其他地方 – code511788465541441 2011-03-07 12:03:46

使用jquery addClass？ http://api.jquery.com/addClass/

來源

2011-03-07 11:51:49 LiorH

爲什麼使用jQuery的開銷比較容易與普通的js一起完成？ – 2011-03-07 11:53:14

這只是一個替代..不是必須 – LiorH 2011-03-08 07:41:32

popupMenuBody.className = "my class"; 

.popups 
    { 
     background-color: #29527A; 
     border: solid 2px white; 
     font-size: 120%; 
     color: white; 
     padding: 10px; 
     padding-left: 30px; 
     text-transform: capitalize; 
    }

來源

2011-03-07 11:52:12

無法正常工作。編輯原始帖子 – code511788465541441 2011-03-07 12:00:09

CSS定義與IE dom屬性不同。你的CSS無效。我已經包含有效的CSS。 – 2011-03-07 12:20:35

我會使用jQuery和addClass()做到這一點：

$('#addressFullSpan').addClass('name')

來源

2011-03-07 11:52:22 tiagoboldt

jQuery有用於將CSS類元素的方法addClass()

http://api.jquery.com/addClass/

來源

2011-03-07 11:53:06 kaese

你試過：

var addressPopupMenu = window.createPopup(); 
function showAddressPopup() { 
    var popup = document.getElementById('addressFullSpan'); 
    popupMenuBody = popupMenu.document.body; 
    popupMenuBody.className = "className"; 
    ... 
}

來源

2011-03-07 11:53:11

它不工作。我編輯了我原來的帖子 – code511788465541441 2011-03-07 12:09:04

一個CSS類分配給在JavaScript創建一個元素，你可以使用下面的代碼行：

popupMenuBody.className = "popups";

你說，這是不行的，但其實這是因爲你的CSS壞了。我假設你已經將一些JavaScript複製/粘貼到了你的CSS文件中，並對其進行了一些修改，因此，你的屬性名稱都是錯誤的。你真正需要爲你的CSS是這樣的：

.popups 
{ 
    background-color: #29527A; 
    border: solid 2px white; 
    font-size:120%; 
    color:white; 
    padding:10px; 
    padding-left:30px; 
    text-transform:capitalize; 
}

請注意，我有：

去掉了「;」「2px的」和「白色」之間
改名爲「fontSize的」到「字體大小」
改名爲「令pColor」到「顏色」
改名爲「paddingLeft」到「填充左」

您的CSS現在應該可以正確應用。

來源

2011-03-07 12:39:27

爲了避免popupMenuBody覆蓋現有的類名，這樣做：jQuery的

popupMenuBody.className += ' class_name';

來源

2011-03-07 12:43:54

我怎樣才能給JavaScript元素一個CSS類？

回答

相關問題