即 headerrow.insertCell(0) 时添加样式
将
headerrow.insertCell(0).appendChild(document.createTextNode("姓名"))
修改为以下格式,
方法一>
var element = headerrow.insertCell(0)
element.appendChild(document.createTextNode("姓名"))
element.style.cssText = "color:#FF0000font-size:24px"
或者将样式写进 css 文件,设置元素的 className:
方法二>
var element = headerrow.insertCell(0)
element.appendChild(document.createTextNode("姓名"))
element.className = class
或者用 "太极八卦饼" 的方法:
方法三>
var element = headerrow.insertCell(0)
element.appendChild(document.createTextNode("姓名"))
element.style.fontSize= "30px"
element.style.color = "#FF0000"
.....
方法二通用性好一些, 只需要写一份CSS, 可以供后面的代码重用, 而且代码进行了分离.
其它的两个处理方法类似
方法一也可以样式文本存入变量, 在当前 js 中实现重用.
var cssText = "color:#FF0000font-size:24px"
var element = headerrow.insertCell(0)
element.appendChild(document.createTextNode("姓名"))
element.style.cssText = cssText
element = headerrow.insertCell(1)
element.appendChild(document.createTextNode("年龄"))
element.style.cssText = cssText
element = headerrow.insertCell(2)
element.appendChild(document.createTextNode("性别"))
element.style.cssText = cssText
可以直接修改div的样式，通过修改元素的style属性值去修改CSS样式。下面是个小例子：
<body>
<div></div>
</body>
<script>
var oDiv = document.getElementsByTagName('div')[0]
oDiv.style.width = '100px' // 增加宽度
oDiv.style.height = '100px' // 增加高度
</script>
本文实例讲述了javascript实现动态导入js与css等静态资源文件的方法。分享给大家供大家参考。具体实现方法如下：/**
*
动态导入静态资源文件js/css
*/
var
$import
=
function(){
return
function(rId,
res,
callback){
if(res
&&
'string'
==
typeof
res){
if(rId){
if($($('#'
+
rId),
$('head')).length>0){
return
}
}
//加载资源文件
var
sType
=
res.substring(res.lastIndexOf('.')
+
1)
//
支持js/css
if(sType
&&
('js'
==
sType
||
'css'
==
sType)){
var
isScript
=
(sType
==
'js')
var
tag
=
isScript
?
'script'
:
'link'
var
head
=
document.getElementsByTagName('head')[0]
//
创建节点
var
linkScript
=
document.createElement(tag)
linkScript.type
=
isScript
?
'text/javascript'
:
'text/css'
linkScript.charset
=
'UTF-8'
if(!isScript){
linkScript.rel
=
'stylesheet'
}
isScript
?
linkScript.src
=
res
:
linkScript.href
=
res
if(callback
&&
'function'
==
typeof
callback){
if
(linkScript.addEventListener){
linkScript.addEventListener('load',
function(){
callback.call()
},
false)
}
else
if
(linkScript.attachEvent)
{
linkScript.attachEvent('onreadystatechange',
function(){
var
target
=
window.event.srcElement
if
(target.readyState
==
'complete')
{
callback.call()
}
})
}
}
head.appendChild(linkScript)
}
}
}
}()
希望本文所述对大家的javascript程序设计有所帮助。
