关于DOM节点CSS属性的设置问题
<html><head><title>dom</title></head><styletype="text/css"><!--.td{border:solid1px#00...
<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(table1);
var header=table1.createTHead();
var headerrow=header.insertRow(0);
headerrow.insertCell(0).appendChild(document.createTextNode("姓名"));
//这怎么设置CSS属性???????????
headerrow.insertCell(1).appendChild(document.createTextNode("年龄"));
//这怎么设置CSS属性???????????
headerrow.insertCell(2).appendChild(document.createTextNode("性别"));
//这怎么设置CSS属性???????????
for (var i=1;i <4;i++)
{
var headerrow=header.insertRow(i);
headerrow.insertCell(0).appendChild(document.createTextNode("cnn"));
headerrow.insertCell(1).appendChild(document.createTextNode("99"));
headerrow.insertCell(2).appendChild(document.createTextNode("男"));
}
}
</script>
<body>
<span onclick="maketable();">测试 </span>
</body>
</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(table1);
var header=table1.createTHead();
var headerrow=header.insertRow(0);
headerrow.insertCell(0).appendChild(document.createTextNode("姓名"));
//这怎么设置CSS属性???????????
headerrow.insertCell(1).appendChild(document.createTextNode("年龄"));
//这怎么设置CSS属性???????????
headerrow.insertCell(2).appendChild(document.createTextNode("性别"));
//这怎么设置CSS属性???????????
for (var i=1;i <4;i++)
{
var headerrow=header.insertRow(i);
headerrow.insertCell(0).appendChild(document.createTextNode("cnn"));
headerrow.insertCell(1).appendChild(document.createTextNode("99"));
headerrow.insertCell(2).appendChild(document.createTextNode("男"));
}
}
</script>
<body>
<span onclick="maketable();">测试 </span>
</body>
</html> 展开
展开全部
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= "30px";
element.style.color = "#FF0000";
.....
方法二通用性好一些, 只需要写一份CSS, 可以供后面的代码重用, 而且代码进行了分离.
其它的两个处理方法类似
方法一也可以样式文本存入变量, 在当前 js 中实现重用.
var cssText = "color:#FF0000;font-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;
即 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= "30px";
element.style.color = "#FF0000";
.....
方法二通用性好一些, 只需要写一份CSS, 可以供后面的代码重用, 而且代码进行了分离.
其它的两个处理方法类似
方法一也可以样式文本存入变量, 在当前 js 中实现重用.
var cssText = "color:#FF0000;font-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;
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
首先你要获得目标对象，就是你要个这个对象加上样式，比如叫做B，然后设置B.style.color="#f00";这是设置其字体颜色；
B.style.backgroundColor="#ccc";这是设置背景色;
B.style.fontSize="12px";这是设置字体大小；
...
可明白了？
B.style.backgroundColor="#ccc";这是设置背景色;
B.style.fontSize="12px";这是设置字体大小；
...
可明白了？
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你设定一个这样的table{}的样式加在里面就好了。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
