这是我参与「第五届青训营 」伴学笔记创作活动的第 3 天,今天回顾了JAVASCRIPT的相关知识,非常喜欢月影老师的讲课,一步一步由浅到深,不离实践的讲解。尽管我已经学习过了JSAVASCRIPT,但是在这次课我却像上新课一样,学习到了很多之前没有考虑到的偏向实践的知识。
1.首先我看到月影老师讲解的深夜食堂文章修改背景颜色案例,html/css/js需各司其职但同时理解了很多时候代码可以通过很多方式而变得简洁,在简单样式变化中应该尽量的减少js的代码而使用css来解决,并且可以多尝试通过class来表示状态,以减少后面需要修改时带来的麻烦
2.在后面的轮播图案例之中我自己也重新设计了一个轮播图的js部分:
3.随后我还总结了一些js基础: DOM核心 对于DOM操作,我们主要针对子元素的操作,主要有 1.创建 2.增 3.删 4.改 5.查 6.属性操作 7.时间操作
1、创建
•document.write
•innerHTML
•createElement
2、增
•appendChild
•insertBefore
3、删
•removeChild
4、改
•主要修改dom的元素属性,dom元素的内容、属性、表单的值等
•修改元素属性:src、href、title 等
•修改普通元素内容:innerHTML、innerText
•修改表单元素:value、type、disabled
•修改元素样式:style、className
5、查
•主要获取查询dom的元素
•DOM提供的API方法:getElementById、getElementsByTagName (古老用法,不推荐)
•H5提供的新方法:querySelector、querySelectorAll (提倡)
•利用节点操作获取元素:父(parentNode)、子(children)、兄(previousElementSibling、nextElementSibling) 提倡
6、属性操作
•主要针对于自定义属性
•setAttribute:设置dom的属性值
•getAttribute:得到dom的属性值
•removeAttribute:移除属性
BOM概述
BOM = Browser Object Model 👉浏览器对象模型
它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象是 window
BOM 由一系列相关的对象构成,并且每个对象都提供了很多方法与属性
BOM 缺乏标准,JavaScript 语法的标准化组织是 ECMA, DOM 的标准化组织是 W3C, BOM最初是Netscape 浏览器标准的一部分
DOM -----------------------------BOM
文档对象模型 ----------------------浏览器对象模型
DOM就是把文档当作一个对象来看待 ------把浏览器当作一个对象来看待
DOM的顶级对象是document -----------BOM的顶级对象是window
DOM主要学习的是操作页面元素 ---------BOM学习的是浏览器窗口交互的一些对象
DOM是W3C标准规范 ------------------BOM是浏览器厂商在各自浏览器上定义的,兼容性较差