动态生成的HTML标签样式问题 5
我有三个文件，.HTML、.js和.css。我的HTML标签是在js文件中用createElement动态生成的。我的问题是，怎么给动态生成的这些标签匹配css样式，我所...
我有三个文件，.HTML、.js和.css。我的HTML标签是在js文件中用createElement动态生成的。我的问题是，怎么给动态生成的这些标签匹配css样式，我所有样式都写在.css文件中。
展开
3个回答
展开全部
动态生成的HTML标签样式一般可以使用2中方式确定
1、在生成HTML时将样式直接以style=""写在标签上；也就是使用行内样式
例如：
//动态生成html时，给html赋值行内样式
$("body").append("<div style='width:100px;height:100px;background:red;'>动态生成的div</div>");
2、预先定义好css样式，动态生成html时，将css类赋值给html
例：
/*定义css样式*/
.content{
width:100px;
height:100px;
background:red;
}
//在动态生成html时，将css样式赋值class
$("body").append("<div class='content'>动态生成html赋值class样式</div>");
总结：在动态生成html标签时，直接使用行内样式快捷，但不容易修改；使用预先定义好的css样式赋值html标签的class属性，容易修改；建议使用后者。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
给你个例子自己看看吧，给生成的标签添加class属性，然后就和不是动态生成的一样了
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Temp Web Page</title>
<style type="text/css">
.li_class{color:#f00;}
</style>
</head>
<body>
<div id="div1"></div>
</body>
<script text="text/javascript">
var div1=document.getElementById("div1");
var e_li = document.createElement("li");
var e_text=document.createTextNode("这里是text");
e_li.setAttribute("class","li_class");
e_li.appendChild(e_text);
div1.appendChild(e_li);
</script>
</html>
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Temp Web Page</title>
<style type="text/css">
.li_class{color:#f00;}
</style>
</head>
<body>
<div id="div1"></div>
</body>
<script text="text/javascript">
var div1=document.getElementById("div1");
var e_li = document.createElement("li");
var e_text=document.createTextNode("这里是text");
e_li.setAttribute("class","li_class");
e_li.appendChild(e_text);
div1.appendChild(e_li);
</script>
</html>
追问
我的意思是，
.li_class{color:#f00;}
是写在.css文件中 ，不和HTML文件写在一起，而是通过标签引用进来的
追答
把这个style加到引用的文件里不就可以了吗
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
js:document.createElement("<input type='text' name='txtName' class='text-class'>");
css: .text-class{border:0;}
css: .text-class{border:0;}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（1）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
