Dom Scripting
Jeremy Keith
Front End
关键字
- Dom Core
- Node Type
- 三条腿
感悟
- Dom Core
80/20原则，作者定义的Dom Core的4个方法是代码组织的核心
document.getElementById("id");
document.getElementsByTagName("tag");
element.getAttribute("attr_name");
element.setAttribute("attr_name","attr_value");
- Node Type
12种类型，常用下3
nodeType=1 元素节点
nodeType=2 属性节点
nodeType=3 文本节点
Dom的方法中要弄清楚返回的节点类型
- 三条腿
Html定义结构/内容；CSS定义表示；JavaScript定义行为
通过在Html定义id及class作为hook，CSS及JavaScript对应定义样式和动作，并单独保存相应文件，解耦并便于维护
Html一般不建议定义动作和样式，并应努力保持语义化
不推荐写法：
<a href="#" onclick="popUp('url')">
推荐写法：
// 只定义html，并href正确填写url信息
<a href="url" id="url-link">
// 通过id作为hook定义事件方法（或统一处理a标签）
window.onload = function(){
var alink = document.getElementById("url-link");
allink.onclick = function(){
popUp(this.href);
return false;
}
}
三条腿的规范能让浏览器在不兼容/关闭CSS和JS时，基于本身的Html正确和完整性，保证访问的兼容性
其他关键字
- Ajax/XMLHttpRequest
Ajax通过XMLHttpRequest实现异步服务器请求和刷新客户端页面，XMLHttpRequest是客户端和服务端的中间件（对象）。 - XHTML
规范HTML写法，按XML规范 - CSS分层
颜色；布局；字体
