javascript DOM 编程艺术 札记2 平稳退化

定义

指的是即便浏览器不支持javascript,页面的基础展示功能也不会受到影响的做法。

不能平稳退化的实例

  • javascript:这种伪协议,它可以通过链接调用javascript函数。比如<a href="javascript:popUp('http://www.example.com');">example</a>
  • 内嵌的事件处理函数 <a href="#" onclick="popUp('http://www.example.com');return false;">example</a>

它们不算平稳退化主要在于如果用户禁用了javascript,这样的链接虽然不会报错但是也失去了原本的作用。

平稳退化的做法

  • <a href="http://www.example.com" onclick="popUp(this.href);return false;">example</a>
  • 即使不支持弹出窗口,基础的功能还在,仍然可以点击链接生效。

一些理论的知识点

  • CSS的最大优点是将Web文档的内容结构(标记)和版面设计(样式)分离开来。
  • 渐进增强:用一些额外的信息层来包裹原始数据。这样的代码容易平稳退化。思考下CSS,就是包裹的样式,即使样式失效,内容本身仍在。
  • 对应的javascript也可以像CSS那样,分离内容结构和页面行为。通常借助于属性节点class和id来实现定位。
  • HTML文档加载完毕时将触发一个window.onload事件,这个事件将document对象加载到window里,所以window.onload执行时,document已经确认存在了
  • 对象检测:使用逻辑非配合return语句比较简洁,更简洁方便地达到检测方法是否存在的目的。比如if(!documen.getElementsByTagName) return false;
  • HTTP规范,浏览器每次从同一域名最多只能同时下载两个文件。(实际上现在的浏览器已经突破这个限制了,看这里)所以脚本放置在之前好一些。因为一般来说,内容优于样式和行为。

一些javascript函数

  • window.open(url, name, features)第三个参数是诸如新窗口宽度高度等的设置。
原文地址:https://www.cnblogs.com/bityinjd/p/10102540.html