关于DOM节点CSS属性的设置问题

来源:百度知道 编辑:UC知道 时间:2024/05/08 20:12:06
<html>
<head>
<title>dom </title>
</head>
<style type="text/css">
<!--
.td{
border:solid 1px #000000;
}
-->
</style>
<script language="javascript">
function maketable()
{
var table1=document.createElement("table"); //创建一个TABLE 标签 也可以是 DIV

table1.setAttribute("border","1");
table1.setAttribute("width","60%");
table1.style.setAttribute("border","solid 2px #000000");
table1.setAttribute("id","table11");
table1.style.setAttribute("backgroundColor","#ffff00");
table1.style.setAttribute("margin","30");
table1.setAttribute("align","center");
table1.setAttribute("fontalign","center");
document.body.appendChild(ta

首先你要获得目标对象,就是你要个这个对象加上样式,比如叫做B,然后设置B.style.color="#f00";这是设置其字体颜色;
B.style.backgroundColor="#ccc";这是设置背景色;
B.style.fontSize="12px";这是设置字体大小;
...
可明白了?

createTextNode 会输出全部文本, 可以在它的容器上添加样式.
即 headerrow.insertCell(0) 时添加样式


headerrow.insertCell(0).appendChild(document.createTextNode("姓名"));
修改为以下格式,

方法一>
var element = headerrow.insertCell(0)
element.appendChild(document.createTextNode("姓名"));
element.style.cssText = "color:#FF0000;font-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=