js中用cssText設(shè)置css樣式的簡(jiǎn)單方法
更新時(shí)間：2016年09月19日 08:11:59 投稿：jingxian
下面小編就為大家?guī)硪黄猨s中用cssText設(shè)置css樣式的簡(jiǎn)單方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
如果網(wǎng)頁(yè)中一個(gè) id為“no”的標(biāo)簽，暫且當(dāng)div標(biāo)簽來tell；
想要在js中設(shè)置這個(gè)div的css樣式，很一般的做法是：
var obj = document.getElementByIdx_x_x('no');
obj.style.width = '400px';
obj.style.height = '300px';
如果要設(shè)置一堆又一堆的css樣式呢，太麻煩了把、
一般情況下都會(huì)結(jié)合css來添加className或者改變className達(dá)到想要的效果，但是如果你create一個(gè)元素，難道還想這樣簡(jiǎn)單點(diǎn)？那就要想別的辦法了~
于是大家就寫了一個(gè)又一個(gè)的函數(shù)，經(jīng)典的兩個(gè)是：
var obj = document.getElementByIdx_x_x('no');
function setStyle(obj, css) {
for(var attr in obj){
obj.style[attr] = css[attr];
}
}
setStyle(obj,{width:"400px",height:"300px"});
當(dāng)然還有更簡(jiǎn)單的，cssText：
var obj = document.getElementByIdx_x_x('no');
obj.style.cssText = "width:400px; height:300px;";
當(dāng)然這種方法對(duì)于create的元素初始化css樣式來說很簡(jiǎn)單很方便。
以上就是小編為大家?guī)淼膉s中用cssText設(shè)置css樣式的簡(jiǎn)單方法的全部?jī)?nèi)容了，希望對(duì)大家有所幫助，多多支持腳本之家~
您可能感興趣的文章:
相關(guān)文章
打開網(wǎng)頁(yè)時(shí)提示 Stack overflow at line: 0。img圖片的onerror事件需要注意的細(xì)節(jié)。2011-01-01
實(shí)例詳解display:none與visible:hidden的區(qū)別
這篇文章主要介紹了實(shí)例詳解display:none與visible:hidden的區(qū)別的相關(guān)資料,需要的朋友可以參考下2017-03-03
本文主要介紹了JavaScript過濾關(guān)鍵字的方法。具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-03-03
獲取JAVASCRIPT時(shí)間戳函數(shù)的5種方法
JavaScript獲得時(shí)間戳的方法有五種,后四種都是通過實(shí)例化時(shí)間對(duì)象new?Date()?來進(jìn)一步獲取當(dāng)前的時(shí)間戳,JavaScript處理時(shí)間主要使用時(shí)間對(duì)象Date,本文對(duì)js時(shí)間戳函數(shù)獲取方法給大家介紹的非常詳細(xì),需要的朋友參考下吧2024-01-01
本文給大家分享的常用腳本有通過數(shù)組，拓展字符串拼接容易導(dǎo)致性能的問題、頁(yè)面 視口 滾動(dòng)條的位置的輔助函數(shù)、調(diào)節(jié)元素透明度的函數(shù)、獲取鼠標(biāo)位置的幾個(gè)通用的函數(shù)、使用cssdisplay屬性來切換元素可見性的一組函數(shù)、樣式相關(guān)的通用函數(shù)、獲取元素當(dāng)前的高度和寬度。2015-03-03
這篇文章主要介紹了javascript彈出帶文字信息的提示框效果,涉及javascript簡(jiǎn)單彈出窗口定義與樣式相關(guān)操作技巧,需要的朋友可以參考下2016-07-07
本篇文章是對(duì)使用JS清空File控件的路徑值的方法進(jìn)行了詳細(xì)的分析介紹，需要的朋友參考下2013-07-07
JavaScript設(shè)計(jì)模式之工廠模式和抽象工廠模式定義與用法分析
這篇文章主要介紹了JavaScript設(shè)計(jì)模式之工廠模式和抽象工廠模式,結(jié)合實(shí)例形式分析了工廠模式的功能、定義、相關(guān)問題解決方法,并分析抽象工廠模式與工廠模式的不同之處,需要的朋友可以參考下2018-07-07
js動(dòng)畫效果制件讓圖片組成動(dòng)畫代碼分享
這篇文章主要介紹了使用js讓圖片組成動(dòng)畫,這樣就可以用js做動(dòng)畫了，大家參考使用吧2014-01-01
Ajax被認(rèn)為是(Asynchronous(異步) JavaScript And Xml的縮寫）,現(xiàn)在允許瀏覽器與服務(wù)器通信而無(wú)須刷新當(dāng)前頁(yè)面的技術(shù)都被叫做Ajax,下面這篇文章主要給大家介紹了關(guān)于ajax在js中和jQuery中的用法,需要的朋友可以參考下2021-08-08