博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript学习笔记(2)——JavaScript和DOM的关系
阅读量:6405 次
发布时间:2019-06-23

本文共 675 字,大约阅读时间需要 2 分钟。

  文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口。DOM实际上是以面向对象方式描述的文档模型。DOM定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。可以把DOM认为是页面上数据和结构的一个树形表示,不过页面当然可能并不是以这种树的方式具体实现。

  说通俗点,DOM就是把HTML语言包装成各种对象并以树的组织形式存放于系统内存,再由浏览器将其渲染成丰富的网页呈现出来。而通过JavaScript对DOM对象的操作就可以反映在浏览器渲染出来的网站上。这样就可以达到制作出功能丰富,交互性强,具有动态特效的网站。

下面我们用一个简单的例子说明JavaScript与DOM的关系。

            

1.页面拥有两个img,一个id为"deng",一个id为" kaiguan"

2.为id=" kaiguan"的img的onclick事件添加一个JavaScript方法change()

3.通过JavaScript的语法获取id为"deng"的DOM对象

4.获取该DOM对象的src属性

5.改变改DOM对象的src属性

 

此页面可以实现点击开关,img分别加载状态为“开”和“关”的两张灯泡图片,实现点击开关动态开关灯的网页特效。

转载于:https://www.cnblogs.com/yoran-yang/p/5212912.html

你可能感兴趣的文章
Linux下添加新硬盘,分区及挂载
查看>>
一起来将vscode变成私人定制笔记本
查看>>
Flutter 云音乐
查看>>
RecyclerView实现多type页面
查看>>
个人的web商城网站
查看>>
debian fcitx
查看>>
排中律与实无穷问题的性质分析
查看>>
08/23 学习总结
查看>>
关于Ubuntu下安装phpmyadmin后mysqli丢失的解决
查看>>
物理层
查看>>
linux多网卡路由设置
查看>>
win7环境下的栈溢出与实战
查看>>
查看ios字体库方法
查看>>
八大监听器
查看>>
self.navigationController退出到指定页面,或者一次性pop出n个页面
查看>>
Quartz实现数据库动态配置定时任务
查看>>
iptables 端口转发以及双向通信
查看>>
备战一线互联网公司Java工程师面试题 (1)
查看>>
ThinkPHP中自动验证失败
查看>>
jquery图片切换插件jquery.cycle.js参数详解
查看>>