為指定元素增加樣式的js代碼
更新時(shí)間：2009年12月09日 04:05:48 作者：
從此例子中發(fā)現(xiàn)，js對(duì)"" 與 " " ，注意中間還有一空格，解析是非常嚴(yán)格的。在java與net中還有待于研究。
這個(gè)函數(shù)主要是為指定的元素添加樣式。相當(dāng)于Jquery中的addClass(class)--為每個(gè)匹配的元素添加指定的類名。
在Jquery中要求 class (String) : 一個(gè)或多個(gè)要添加到元素中的CSS類名，請(qǐng)用空格分開。而這個(gè)函數(shù)也是有這樣的要求。
div{ border:1px solid #ccc; width:200px; height:200px;}
.a{ background:#900; }
.b{ font-size:30px; font-weight:bold;}
function addClass(elements, value)
{
if (!elements.className) {
elements.className = value;
}
else
{
newClass = elements.className;
newClass += " ";
newClass += value;
elements.className = newClass;
}
}
window.onload = function ()
{
var test = document.getElementById('test');
alert(test.className);
addClass(test, 'a b');
//addClass(test, 'b');
}
<div id="test">這里是測(cè)試層</div>
在Jquery中要求 class (String) : 一個(gè)或多個(gè)要添加到元素中的CSS類名，請(qǐng)用空格分開。而這個(gè)函數(shù)也是有這樣的要求。
復(fù)制代碼 代碼如下:
div{ border:1px solid #ccc; width:200px; height:200px;}
.a{ background:#900; }
.b{ font-size:30px; font-weight:bold;}
復(fù)制代碼 代碼如下:
function addClass(elements, value)
{
if (!elements.className) {
elements.className = value;
}
else
{
newClass = elements.className;
newClass += " ";
newClass += value;
elements.className = newClass;
}
}
window.onload = function ()
{
var test = document.getElementById('test');
alert(test.className);
addClass(test, 'a b');
//addClass(test, 'b');
}
<div id="test">這里是測(cè)試層</div>
相關(guān)文章
解析JavaScript中的不可見數(shù)據(jù)類型
這篇文章主要是對(duì)JavaScript中的不可見數(shù)據(jù)類型進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2013-12-12
在IE8上JS實(shí)現(xiàn)combobox支持拼音檢索功能
這篇文章主要介紹了在IE8上JS實(shí)現(xiàn)combobox支持拼音檢索功能的相關(guān)資料，本文介紹的非常詳細(xì)，具有參考借鑒價(jià)值,需要的朋友可以參考下2016-05-05
javascript動(dòng)態(tài)生成樹形菜單的方法
這篇文章主要介紹了javascript動(dòng)態(tài)生成樹形菜單的方法,涉及JavaScript針對(duì)頁面元素與屬性的動(dòng)態(tài)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
js 數(shù)組隨機(jī)字符串(廣告不重復(fù))
今天一個(gè)網(wǎng)友想讓他的廣告隨機(jī)顯示，每次刷新廣告的內(nèi)容都不一樣，經(jīng)過參考源碼網(wǎng)站分析就是通過下面代碼實(shí)現(xiàn)，特分享下方便需要的朋友2013-08-08
這篇文章主要介紹了深入理解es6塊級(jí)作用域的使用，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
按下Enter焦點(diǎn)移至下一個(gè)控件的實(shí)現(xiàn)js代碼
正如標(biāo)題所言使用js操作按下Enter焦點(diǎn)移至下一個(gè)控件，具體的實(shí)現(xiàn)示例如下，需要的朋友可以參考下2013-12-12
BootStrap下的彈出框加載select2框架失敗的解決方法
本文通過簡(jiǎn)單的代碼給大家介紹了BootStrap下的彈出框加載select2框架失敗的解決方法，需要的朋友參考下吧2017-08-08
package.json俗稱依賴配置文件（我自己取的名）,最主要的作用就是管理項(xiàng)目中所用到的依賴,下面這篇文章主要給大家介紹了關(guān)于package.json屬性的相關(guān)資料,需要的朋友可以參考下2022-02-02
js實(shí)現(xiàn)Form欄顯示全格式時(shí)間時(shí)鐘效果代碼
這篇文章主要介紹了js實(shí)現(xiàn)Form欄顯示全格式時(shí)間時(shí)鐘效果代碼,可讀取當(dāng)前的完整時(shí)間并實(shí)時(shí)顯示,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08
Web?Woker與主線程通信場(chǎng)景下對(duì)postMessage的簡(jiǎn)潔封裝詳解
這篇文章主要為大家介紹了Web?Woker與主線程通信場(chǎng)景下對(duì)postMessage的簡(jiǎn)潔封裝示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09