
今天写到了这本书的第四章,这书的第四章主要是对一个例子进行研究,这个例子是JavaScript图片库,就是上边看到的这个网页图片库效果。把整个图片库的浏览链接集中安排图片库的网页里,只要用户点击了这个网页中的某个图片链接时才把相应的图片显示在我们的眼前,在这章中我自己感觉最大的收获就是知道了默认行为的问题,有些链接(或者别的东西)点击时既跳到了href指定的网页中,又执行了onclick事件所指定的函数。我们本来想执行onclick所指定的函数,但是被点击链接的默认行为也会被调用,从而出现了意外的效果,有些时候这是我们不想看到的,为了阻止默认的行为,我们需要加上一些东西。书上有几句话我感觉说的比较明白:“事件处理函数的机制。在给某个元素添加了事件处理函数之后,一旦事件发生,相应的JavaScript的代码就会得到执行,被调用的JavaScript代码可以返回一个值,这个值将被传递给那个事件处理函数。例如,我们可以给某个链接添加一个onclick事件处理函数,并让这个处理函数所触发的JavaScript代码返回布尔值true或false。这样一来,当这个链接被点击时,如果那段JavaScript代码返回的值是true,onclick事件处理函数就认为“这个链接被点击了”;反之,如果返回的知识false,onclick事件处理函数就认为这个“这个链接没有被点击”。比如说<a
href='http://www.baidu.com"onclick="return false">Click me</a>,对于这个链接当被点击时不会跳转到指定的页面。”这段说的十分的明白,通过写一个简单的图片库也能学到一些细节性的知识。以下是这个图片库的代码,有些内容我更改了一下。
html代码
CSS代码:
JavaScript代码
点击图片一之后的效果如下;

对于上边的这个图片库还有挺多要改的地方,这都是后边的哪些章节的事了,以后我还会接着写。如果有不足的之处希望大家谅解。
哦,对了上边的这个图片是我家乡的图片,位于大兴安岭图强镇的“龙江第一湾”。是不是很漂亮!
分享到:
相关推荐
●JavaScript的起源 ●浏览器之争 ●DOM的演变史 对网页设计人员来说,这是一个充满着...在开始学习DOM之前,我们先回顾一下使网页具备可交互性的程序设计语言。这种语言就是JavaScript,它已经诞生相当长的时间了。
《JavaScript+DOM编程艺术》一书作为经典学习资源,详细介绍了JavaScript和DOM的基本知识,通过实例阐述了网页开发的高级技术,并强调了一些重要的编程原则和最佳实践。 #### JavaScript简史 JavaScript语言诞生于...
适用人群:主要面向已经有一定编程经验的学习者或开发者,他们希望通过一份系统的参考资料快速回顾或深入理解JavaScript的各种关键特性和技术细节。 使用场景及目标:该手册适用于需要频繁查询JavaScript相关知识点...
综上所述,《javascript实例集合》不仅仅是一份资源集合,更是深入学习和掌握JavaScript编程艺术的宝典。通过实践这些实例,开发者能够巩固理论知识,提高编码技巧,最终成为一名优秀的前端工程师。
此外,DOM编程艺术是一本很好的实践书籍。在这一阶段,你需要通过GitHub部署静态网站,并初步了解Git的使用。 ### 第二阶段:进阶与工具学习 在这个阶段,你可以开始接触Node.js作为前端的辅助工具,学习npm的基本...
JavaScript是一种广泛应用于网页和网络应用的编程语言,用于实现客户端的动态效果和交互。在Burning Eric的官方网站上,JavaScript可能被用来创建丰富的用户体验,比如动画、响应式设计、实时数据更新或者用户交互...
【标题】"创意编码-DM-GY-6063:我的创意编码类工作的回购" 涉及的主题是创意编码,这是一种将艺术与技术相结合的编程方式,它鼓励开发者用创新的方式解决问题,同时创造出富有视觉吸引力和互动性的作品。在这一项目...
在早期网页设计中,JavaScript的使用往往需要开发者具备扎实的编程基础,因为那时的浏览器兼容性问题更为突出。"LeagueOfElitePixel"项目很可能是通过精心的代码优化,确保在多种浏览器环境下都能正常运行。这需要对...
【标题】"lastfm-to-...通过这个项目,开发者不仅可以学习到如何使用API进行数据交换,还能了解到如何处理异步操作、错误处理、用户界面设计等多个方面,对于提升JavaScript编程技能和了解Web服务的交互非常有帮助。
【标签】"JavaScript"表明这个项目是使用JavaScript开发的,这是一种广泛用于Web开发的编程语言。JavaScript在前端负责处理用户交互、更新DOM(文档对象模型)以及与服务器进行异步通信。在这个项目中,JavaScript...