createElement 指定样式和事件

作者:vkvi 来源:ITPOW(原创) 日期:2008-6-17

这里只讲指定样式,关于事件请参见在各浏览器中动态添加事件

var message = document.createTextNode("info");
var p = document.createElement("p");
p.setAttribute("style", "color:red;");
p.appendChild(message);
 
document.body.appendChild(p);

以上代码创建一个 p,并设置颜色为红色,但是上述代码在 FF 中有效,在 IE 中却无效,要兼容两个浏览器,可以采用如下代码。

方法一、

var message = document.createTextNode("info");
var p;
try
{
    p = document.createElement("<p style=\"color:red\">");
}
catch(e)
{
    p = document.createElement("p");
    p.setAttribute("style", "color:red;");
}

p.appendChild(message);
 
document.body.appendChild(p);

方法二、

var message = document.createTextNode("info");
var p = document.createElement("p");
p.appendChild(message);
p.style.color = "red";

document.body.appendChild(p);

方法三、

var message = document.createTextNode("info");
var p = document.createElement("p");
p.appendChild(message);
var np = document.body.appendChild(p);

np.style.color = "red";

方法四、

var message = document.createTextNode("info");
var p = document.createElement("p");
p.appendChild(message);
p.id = "pid";
 
document.body.appendChild(p);
document.getElementById("pid").style.color = "red";
相关文章