在以前的课程中,我们学习了对文本和字符串的各种操作,今天我们专注于两种不同的数据类型:图象和对象。学完这一课,你将知道如何: 使用JavaScript来加速图象交换。 创建你自己的对象来使脚本易于理解。 使用关联数组来快速存取脚本中的每一个对象。 使用JavaScript做图象变换的一个主要问题是,它直到需要换图时才去告诉浏览器下载那张图象。如果你有一张大的图象,想在鼠标滑过一副图象时调出来,浏览器得临时下载这张图,这可能会花一定时间从而使滑动效果大打折扣。 如果你的连接速度较慢,而你要调入的是一个相当大的图象的话,那你把鼠标放到图上后只好去等待。由于有的浏览器要求被调入的图象必须保存在缓冲区里,所以有时你可能根本就看不到图象变换的效果。为了避免这些烦心的问题,我们可以把要变换的图象在页面调入时就预先装载。 在Web编程时,预装载是在需要图片之前就将图片下载到缓存的技术。采用这样的方式可以使当确实需要显示图片时迅速将其从缓存中恢复回来并立即显示。 预装载图象其实并不困难。你要做的就是创建一个新的image对象,然后把要预装的图象名设定成image的src属性,如下所示: var an_image = new Image(); an_image.src = "my_nice_image.gif"; 通过设置image的src属性就可以自动地把图象下载到你的硬盘里(当然假设你的cache可以用),然后图象变换时就从硬盘直接读入图象而不用再去下载了。 剩下要做的唯一一件事就是,怎样在页面被下载以后和图象变换操作之前使预装图象发生。让人愉快的是这很简单。HTML中的body标记有一个事件处理器叫onLoad,当页面被调入后它将被调用。如果你的body标记是这样的: <body onLoad="doPreload();"> 那么doPreload()函数将在网页下载后被调用。函数的代码是这样的: function doPreload() { var the_images = new Array(kwmatt.jpg,matbon.jpg,lunchMat.jpg); preloadImages(the_images); } function preloadImages(the_images_array) { for(loop = 0; loop < the_images_array.length; loop++) { var an_image = new Image(); an_image.src = the_images_array[loop]; } } doPreload()函数创建了需要预装的图象名的数组,并把数组作为参数传送到preloadImages()函数, preloadImages()函数包含了一个循环,每次循环都创建一个新的图象对象,并把图象名设到它的src属性中。 不很难吧?图象对象相当有用对吧?我很高兴你这样想,休息一会儿,马上我们就要进入一个更令人兴奋,更让人动脑筋的话题:创建你自己的对象。
推荐整理分享JavaScript进阶教程(第四课第一部分)(js 进阶),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:javascript进阶书籍,javascript教程完整版,js 进阶,javascript教学视频,JavaScript进阶教程,JavaScript进阶教程,js 进阶,javascript进阶书籍,内容如对您有帮助,希望把文章链接给更多的朋友!
JavaScript初级教程(第一课)第1/4页 交互性!多数网站声称交互性即当你点击一个链接时到达一个新的页面,但严格道来甚至当网页中具有CGI语言时也并不意味它真正具有交互性。填好表
JavaScript初级教程(第二课)第1/7页 上一讲我们学了JavaScript出现在何处,看起来象什么。现在我们开始学习这种语言。本课我们将学习JavaScript如何存储信息,如何根据信息作决定,如何根
JavaScript初级教程(第三课)第1/2页 本课的目的是调用目标名,本例中即窗口名yer_new_window。既然我们已经简单的重温了一下href目标,那么该开始学习在JavaScript中打开窗口.在HTML中打开窗口