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)第三个参数是诸如新窗口宽度高度等的设置。
javascript DOM 编程艺术 札记2 平稳退化的更多相关文章
- javascript DOM 编程艺术 札记1
一个重要观点 DOM 是指 文档对象模型,它对应浏览器实际认知的东西.html 文本本身和 html 加载到浏览器中显示的东西并不是完全一致的,后者就是 DOM 节点树,它是浏览器实际认知的东西.一个 ...
- JavaScript DOM编程艺术读后感(1)—— 平稳退化
最近,在读<JavaScript DOM编程艺术(第二版)>这本书,想着将自己的读后感记录下来,作为记忆吧. 其实我并不是最近才刚开始读这本书的,我读了有一段时间了.我是一名web前端开发 ...
- 读书笔记:JavaScript DOM 编程艺术(第二版)
读完还是能学到很多的基础知识,这里记录下,方便回顾与及时查阅. 内容也有自己的一些补充. JavaScript DOM 编程艺术(第二版) 1.JavaScript简史 JavaScript由Nets ...
- JavaScript DOM编程艺术学习笔记(一)
嗯,经过了一周的时间,今天终于将<JavaScript DOM编程艺术(第2版)>这本书看完了,感觉受益匪浅,我和作者及出版社等等都不认识,无意为他们做广告,不过本书确实值得一看,也值得推 ...
- 《JavaScript DOM 编程艺术》 学习笔记
目录 <JavaScript DOM 编程艺术> 学习笔记 第一章 js简史 第二章 js语法 准备工作 语法 第三章 DOM DOM中的D DOM中的O DOM中的M 第四章 js图片库 ...
- JavaScript DOM 编程艺术
最近把JavaScript DOM 编程艺术这本书看完了,觉得这本书很好 深入浅出地展示了渐进增强.平稳退化.结构和样式分离等编程思想,我对书中重要的知识进行了梳理总结. 一.网页 二.JavaScr ...
- JavaScript DOM编程艺术(第2版)的简单总结
介绍 JavaScript DOM编程艺术(第2版)主要讲述了 JavaScript.DOM 和 HTML5 的基础知识,着重讲述了 DOM 编程,并通过几个实例演示了具有专业水准的网页开发. 下面介 ...
- JavaScript DOM 编程艺术·setInterval与setTimeout的动画实现解析
先贴上moveElement()函数的大纲,为了方便观看,删了部分代码,完整版粘到文章后面. function moveElement(elementID,final_x,final_y,interv ...
- JavaScript DOM编程艺术第一章:JavaScript简史
本系列的博客是由本人在阅读<JavaScript DOM编程艺术>一书过程中做的总结.前面的偏理论部分都是书中原话,觉得有必要记录下来,方便自己翻阅,也希望能为读到本博客的人提供一些帮助, ...
随机推荐
- Java练习 SDUT-1184_拍皮球
C语言实验--拍皮球 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 小瑜3岁了,很喜欢玩皮球,看来今后喜欢打篮球的^_ ...
- Java练习 SDUT-1194_余弦
C语言实验--余弦 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 输入n的值,计算cos(x). Input 输入数据 ...
- jQuery Css类
通过 jQuery,可以很容易地对 CSS 元素进行操作 jQuery 操作 CSS jQuery 拥有若干进行 CSS 操作的方法.我们将学习下面这些: addClass() - 向被选元素添加一个 ...
- IO NIO AIO及常用框架概述
概述 nio 同步: 自己亲自出马持银行卡到银行取钱(使用同步IO时,Java自己处理IO读写). 异步: 委托一小弟拿银行卡到银行取钱,然后给你(使用异步IO时,Java将IO读写委托给OS处理,需 ...
- hdu 4347 The Closest M Points(KD树)
Problem - 4347 一道KNN的题.直接用kd树加上一个暴力更新就撸过去了.写的时候有一个错误就是搜索一边子树的时候返回有当前层数会被改变了,然后就直接判断搜索另一边子树,搞到wa了半天. ...
- 让 AE 输出 MPEG
最近在做视频后期处理,但是我发现 AE 的文件都很大,大概一个 10 分钟视频 10G ,所以有什么办法让他输出的文件变小?一个方法是使用 MPEG 输出. 本文告诉大家如何让 AE 输出 MPEG ...
- 安装win下的Anaconda ----针对python3.6.4版本
我的python版本是3.6.4, Anaconda下载地址: Anaconda官网:https://repo.anaconda.com/archive/ 清华大学镜像站:https://mirror ...
- SuperSocket通过本地证书仓库的证书来启用 TLS/SSL
你也可以通过本地证书仓库的证书,而不是使用一个物理文件. 你只需要在配置中设置你要使用的证书的storeName和thumbprint: <server name="EchoServe ...
- 学习PHP好,还是Python好呢?
首先简单介绍一下Python. Python在出现以来,已经有数以千计基于这项技术的网站和软件项目,Python因其独有的特点从众多开发语言中脱颖而出,深受世界各地的开发者喜爱. 下面,我们列举了Py ...
- Activiti学习之spring boot 与activiti整合
声明:本文是springboot2.0的多项目构建,springboot2.0和spingboot1.5的配置是有出入的,构建项目之前请规范您的springboot版本,选择2.0以上. 一.在IDE ...