这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
本文将对在网页中引用 js 常会出现的问题进行汇总,并提出解决问题的具体方案,有助于我们更好的学习和使用 js,需要的朋友一起来看下吧
1 假如浏览器不支持 JavaScript 怎么办?
a. 为什么浏览器会不支持?大部分浏览器都有禁用脚本的功能,例如 chrome。
b. 在 js 被禁用的情况下要保证网页仍能实现它的核心功能(关键的用户需求)
例子:在一个新窗口里打开链接,可以使用 BOM 的 open() 方法
- function popUp(winURL) {
- window.open(winURL, "popup", "width=320,height=480");
- }
具体的 js 实现有以下几个方案:
方案一:使用 javascript 伪协议:Example
方案二:使用内嵌的事件处理函数:
以上两种种实现方案,在 js 被禁用时,"在一个新窗口里打开链接" 这个需求就无法满足了。所以,不能为了单纯使用 js 而滥用 js。下面这个实现方案就为 js 预留出了退路,即所谓平稳退化(留好 js 被禁后的退路)
方案三:平稳退化 http://www.example.com"onclick="popUp(this.href;return false;)">
2 如何将网页的结构、内容与 JavaScript 脚本的动作分离开?为什么要分离开?
a. 分工明确,各干各的,然后才是协作:
网页结构、内容 - 由 html 来做、网页的样式 - 由 CSS 来做、网页的行为 - 由 JavaScript 来做
b. 分离 js 代码其实很简单,js 代码不要求事件必须在 html 中处理,可以在外部 js 文件里将一个事件添加到 html 文档中的某个元素上。例如:
- window.onload = paperLinks
- function paperLinks() {
- var links = document.getElementsByTagName("a");
- for (var i=0; i<links.length;i++){
- if (links[i].getAttribute == "popup") {
- linnks[i].onclick = function() {
- popUp(this.getAttribute("href"));
- return false;
- }
- }
- }
- }
3 浏览器的兼容性问题
新老要通吃,尤其要注意老的,即向后兼容。不同的浏览器对 js 的支持程度不一样,比如 document.getElementsByClassName(classname)IE6 就不支持,加一个检查语句就可以检查兼容性问题:if(!document.getElementsByClassName) return false;
4 性能考虑
为什么要考虑脚本执行的性能?性能是永远要考虑的问题,这涉及到你编写的网页能否顺利的加载。
如何保证脚本执行的性能是最优的?
a. 尽量少访问 dom 和少使用标记,例如:少用循环遍历
- var links = document.getElementsByTagName("a");
- if (links.length > 0) {
- for (var i=0; i<links.length; i++) {
- //......
- }
- }
就要比下面的代码性能要好
if (document.getElementsByTagName("a").length> 0) {
var links = document.getElementsByTagName("a");
for (var i=0; i
//......
}
}
b. 合并脚本 (js 代码),减少页面加载时发送的请求数量;将 <script> 标签放置于文档末尾,在 </body> 结束之前,这样可以让页面加载的快些,且不影响 js 的加载。
c. 压缩脚本,将 js 代码中不必要的空格、注释删除,甚至可以将变量名简化。可以准备两个版本的 js:一个是工作版本,用于修改代码和注释,另一个为精简版本,则用于发布。
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持 phperz!
(adsbygoogle = window.adsbygoogle || []).push({});
来源: http://www.phperz.com/article/17/0702/329482.html