findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。 语法： 1arr.findIndex(callback[, thisArg]) 参数： callback¹——>针对数组中的每个元素，都会执行该回调函数，执行时会自动传入三个参数:element——>当前元素。index——>元素的索引。array——>调用findIndex的...

Web 开发模式： 1**.服务器端渲染的传统模式Web开发模式** 服务器通过字符串的拼接，动态生成的 优点： ① 前端耗时少。因为服务器端负责动态生成 HTML 内容，浏览器只需要直接渲染页面即可。尤其是移动端，更省电。 ② 有利于SEO。因为服务器端响应的是完整的 HTML 页面内容，所以爬虫更容易爬取获得信息，更有利于 SEO。 缺点：

引入axio文件 axios是一个用于进行ajax操作的js库 -体积小，功能独立，除了ajax以外没有其他的额外功能 ​

html部分： 只是一段代码没注释也不是很多 enter编码13

伸缩布局 什么时候使用伸缩布局: 1.如果在在网页中希望让元素一行显示,并且元素随着父元素的宽度改变布局方式不会受影响 2.使用了伸缩布局以后,还可以使用浮动,定位,margin,padding 3.伸缩布局只是一个新的布局方式,不要把伸缩布局看的太重或者太难 核心知识点 1.伸缩盒子设置 2.设置伸缩盒子主轴

节点关系获取元素 演示： 使用元素的一些关系属性获取元素。 准备的素材：一个有id的无序列表。通过children找出第2个li，然后据此演示使用其他一些关系以获取元素。

第一天 1.ctrl+s 保存 Lorem 乱数假文 2.英文下的 ！+Tab 注：（vs code） 3.字符集-----避免乱码(utf- 8) 注:不区分大小写 4.语言的种类-----避免编译器乱码 eg: en 、zh-CN 5.关于h1 网页只有一个标题

响应式布局写对位置 1.(同一个网页在不同设备中[布局]呈现的效果) 核心知识 ◎媒体查询 媒体查询 liagn-height 可以不用加px (一倍) 1234567@media only screen and (width:**/*不加分号*/) { /* 加空格*/ div { 宽 高 背景颜色 }} 1.媒体查询就是响应式布局实现的原理 2.总结:可以让css代码在满足某些条件的情况下才去执行

流式布局 1.ppi 像素密度(越高画质越好,相反)-----没用[设备像素] 2.dpr物理像素比(具体不能改变的比例关系–作用–适配) [硬件] 视口(viewport) 1.禁止------水平滚动—页面缩放 2.视口-----pc[浏览器的大小]----移动[移动设备的大小] 视口的设置 1<meta name="viewport" content="width=device-width, initial-scale=1.0"> 移动设备宽 ←↑ ↑→ 忘了 注: 左右固定—中自适应 **注:**精灵图----向上向左

移动回顾 1.流式布局 2.伸缩布局-----------[修改主轴的方向,设置元素在主轴方向的对齐,元素在侧轴的对齐方式] 3.响应式布局-----------[解决了同一个网页在不同设备中布局显示效果不同] 核心知识点----------媒体查询 页面适配 rem适配 -------相对html中的文字大小

放大与缩小案例 123456789101112131415161718<button id='jkl'>放大</button><button id='kjl'>缩小</button><br><img src="gl.jpg" alt="" width="100"><script> var img = document.querySelector('img'); var kids = img.width; var jkl = document.querySelector('#jkl'); var kjl = document.querySekector('#kjl'); jkl.onclick = function(){ kids += 20； img.width = kids； } kjl.onclick = function（）｛ kids -= 20； img.width = kids； ｝</script>

第二天 json 更改 表格:跨行(rowspan)是竖着[从上往下夸] 跨列(colspan)横着 ctrl f 查找 ctrl s 保存 auto rename tag 插件 按住滚轮往下b

bootstrap框架 1.为了快速实现响应式布局和移动端页面为主. 2.全局样式[网页中常见标签的基本样式设置] 栅格系统[为实现响应式布局的]-------媒体查询

rem适配 [vw] 移动端方式 补:opacity: 透明颜色; 1.**流式布局(百分比布局)**2.**伸缩布局(弹性布局)**3.响应式布局(媒体查询) 4.**rem适配:**让元素(内容)随着设备的宽度改变,自己发生大小的改变 12计算移动端中根标签[html]文字大小=当前设备宽度(动态获取)/缩放的倍数 媒体查询----定义一个变量 12计算ui图片中测量元素的rem值=测量大小/(ui图大小/缩放倍数)rem值是根据根(html)标签的文字大小来设置的 ​ 注: UI 图中缩放的倍数必须和设备中缩放的倍数统一 @size是什么?