Javascript的运用与提高
2016-07-15田明山
田明山
【摘 要】JavaScript作为一种网络的脚本语言、解释性语言,采用小程序段的方式实现编程,广泛的应用于网页制作过程中,被几乎所有的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用,是因特网上最流行的脚本语言。当你学习它、使用它、掌握它时,你一定会喜欢上它。
【关键词】程序设计;JavaScript;问题解决
JavaScript属于计算机专业类的重要教学内容,对学生提高网页设计水平具有重要意义。为保证学生能掌握JavaScript的网页制作,更好的培养网页制作的实践型人才,本文通过对JavaScrip学习过程中需要关注并加以解决的问题的分析,旨在提升学生掌握JavaScrip的层次。
1 如何在js被禁用的情况下要保证网页仍能实现它的核心功能
具体的js实现有以下几个方案:
方案一:可以使用javascript伪协议:
方案二:使用内嵌的事件处理函数:
当我们采用以上两种方案,在js被禁用时,“在一个新窗口里打开链接”这个功能就无法实现了。所以,我们不能为了使用js而滥用js。以下方案就为js预留出了退路,即所谓的平稳退化(留好js被禁后的退路)
方案三:平稳退化:
2 getElementsByName和getElementsById的区别
通常我们在获取页面内控件时有多种方法,比如document.getElementsByName和document.getElementsById。如果您需要查找文档中的一个特定的元素,最有效的方法是 getElementById()。由于一个页面中的 name 属性可能不唯一(如 HTML 表单中的单选按钮通常具有相同的 name 属性),而getElementsByName() 方法则返回带有指定名称的对象的集合(即数组)。
3 将网页的结构和内容与JavaScript脚本的动作分离
3.1 网页的结构和内容由html来做,而网页的样式则由CSS来做,网页的行为让由JavaScript来做
3.2 分离JavaScript代码其实很简单,JavaScript代码并不要求事件必须在html中处理,完全可以在外部JavaScript文件里将一个事件添加到html文档中的某个元素上。
4 浏览器的兼容性问题
兼容性问题是由于多种浏览器同时存在而导致的。用户在使用不同浏览器访问一个相同的页面时,所看到的效果有时会有差异。这种差异可能会比较小,甚至不会被用户注意到;也可能很大,极端情况下可能造成在某种浏览器下无法正常浏览。引起这些差异的问题统称为“浏览器兼容性问题”。我们所要做的是新老要通吃,尤其要注意老的,即向后兼容。比如:
4.1 document.formName.item(”itemName”) 问题
问题说明:IE下,可以使用 document.formName.item(”itemName”) 或 document.formName.elements ["elementName"];而ff 下,只能使用document.formName.elements["elementName"]。
解决途径:统一使用document.formName.elements["elementName"]。
4.2 数组类对象问题
问题说明:IE下,可以使用 () 或 [] 获取数组类对象;ff下,只能使用 [ ]获取数组类对象。
解决途径:统一使用 [] 获取集合类对象。
4.3 window.location.href问题
问题说明:使用IE或者ff2.0.x以下版本,可以使用window.location或window.location.href;而ff1.5.x以下版本,却只能使用window.location。
解决方法:只使用 window.location 以避免版本兼容问题。当然也可以使用 location.replace()方法。
4.4 frame和iframe问题
4.4.1 访问frame对象
IE:可以使用window.frameId或者window.frameName来访问frame对象;
ff:只能使用window.frameName来访问frame对象;
解决方法:统一使用 window.document.getElementById(”frameId”) 来访问这个frame对象。
4.4.2 切换frame内容
在IE和ff中都均使用 window.document.getElementById(”frameId”).src=“example.html”或 window.frameName.location=“example.html”来更改frame中的内容;
如果需要将frame中的参数传回父窗口,可以在frame中使用parent关键字来访问父窗口。
4.5 innerText的问题.
问题说明:innerText在IE中可以正常工作,但是innerText在ff中却不起效果。
解决方法:在非IE浏览器中可以使用textContent代替innerText。innerHTML 能够同时被ie、ff等浏览器支持,而outerHTML却只能被ie支持,最好不用。
5 性能考虑
以前的程序员话费大量的精力,想尽一切的办法把程序的效率弄得高一点,因为那时的计算机非常慢,而且也非常贵,而现如今的计算机不仅快多了而且也便宜多了,是不是就无需考虑执行性能了呢?性能是永远要考虑的问题,这涉及到你编写的网页能否顺利快速地加载。
那如何保证脚本执行的性能是最优的呢?我们可以尽量做到以下几点。
5.1 尽可能少访问dom、少使用标记、少用循环遍历
5.2 合并脚本代码(js代码),减少页面在加载时所发送的请求数量;将之前,这样可以加快页面的加载速度,却不影响js的加载。
5.3 尽可能的压缩脚本:将js代码中多余的空格、注释删除,甚至可以将变量名简化。可以准备两个版本的js脚本文件:一个是工作版本,用于修改代码和注释,另一个为精简版本,则用于发布。
不管什么样的语言,能实际运用才是王道,技术是靠练出来的,也就是说多做项目,你才能有提高。JavaScript更是如此,同时JavaScript的掌握和运用还需要结合HTML、SQL、CSS等的学习来提高自己综合能力。一个人必须去感受和领悟构建程序带来的强烈快感。当你一步步的掌握知识点,一点点的将程序搭建起来时,就会对自己产生激励与肯定,带来十分美妙的满足感。
【参考文献】
[1]W3School.W3School教程JavaScript.
[2]Jaward.如何正确学习JavaScript.
[3]周翔.提高web应用性能之 JavaScript 性能调优.
[责任编辑:王伟平]