js之dom_2

动态脚本
1 载入脚本文件

var s = document.createElement("script");
s.src = "test2.js";
s.type = "text/javascript";
document.body.appendChild(s);

2 创建一段js程序块
由于ie中不支持script节点操作文本节点，只能通过script节点的text属性赋值，但safari3.0-不支持text属性

var s = document.createElement("script");
s.type = "text/javascript";
if (s.text != undefined) {
    s.text = "alert('hello world')";
} else {
    var t = document.createTextNode("alert('hello world')");
    s.appendChild(t);
}
document.body.appendChild(s);

动态样式表
1 载入样式表文件

var l = document.createElement("link");
l.href = "test.css";
l.type = "text/css";
l.rel = "stylesheet";
var head = document.getElementsByTagName("head")[0];
head.appendChild(l);

2 创建css片段
由于ie中不支持likn节点操作文本节点，只能通过script节点的styleSheet.cssText属性赋值（使用这种方法有时候也会出错！）

var l = document.createElement("link");
l.type = "text/css";
l.rel = "stylesheet";
if (l.styleSheet != undefined) {
    l.styleSheet.cssText = "#mydiv{color:red;}";
} else {
    var t = document.createTextNode("#mydiv{color:red;}");
    l.appendChild(t);
}
var head = document.getElementsByTagName("head")[0];
head.appendChild(l);

Element的事件属性、样式属性 1 事件属性 通过属性调用得到的是js方法 getAttribute调用得到的是代码字符串 （ie8-得到的都是js方法）

2 样式属性 通过属性调用得到对象 getAttribute调用得到的是空

setAttribue 在ie8-设置class、style、事件无效，建议获取和设置都使用属性调用这种方法

var d = document.getElementById("d1");
alert(typeof d.onclick);
alert(d.getAttribute("onclick"));

alert(d.getAttribute("stlye"));
alert(d.style);
alert(d.style.color);

文本处理
innerHTML 把元素中间的全部文本输出包括html标签（同时ie、opera标签名变为大写），赋值不会自动html编码
innerText 把元素中间的全部文本输出不包括html标签，赋值会自动html编码（FF不支持这个属性）

var d = document.getElementById("mydiv");
alert(d.innerHTML);
alert(d.innerText);
d.innerHTML = "<p>hehe</p>";
alert(d.innerHTML);
d.innerText = "<p>haha</p>";
alert(d.innerHTML);