welcome

ricardo-simple

导航

2022年4月27日 #

Dom事件

摘要: DOM事件 DOM绑定事件 之前接触的事件: // 监听Input输入事件 dom.addEventListener("input", function () {}); // 监听鼠标放置,移动事件 dom.addEventListener("mouseover", function () {}); 阅读全文

posted @ 2022-04-27 21:14 RicardoSimple 阅读(26) 评论(0) 推荐(0) 编辑

Dom鼠标移动事件

摘要: 鼠标移动事件 分类: mousemove这个是鼠标移动事件,比较简单 mouseenter/mouseleave这个是鼠标进入和离开,但是仅仅作用于当前DOM节点,不会作用于后代节点 mouseover/mouseout也是鼠标进入和离开事件,但是与enter/leave不同,此事件除了作用于当前节 阅读全文

posted @ 2022-04-27 21:14 RicardoSimple 阅读(234) 评论(0) 推荐(0) 编辑

JSDom

摘要: DOM 文档对象模型(DOM)可以将web页面和脚本或编程语言连接起来 1. 这里的web页面,也就是我们之前用HTML和CSS绘制的页面,也称作为文档 2. 脚本或编程语言。是因为DOM是一种规范,或者是一种约定,只要遵循这个约定,那么无论是JS,.还是python,或者java都可以被联系起来 阅读全文

posted @ 2022-04-27 21:13 RicardoSimple 阅读(126) 评论(0) 推荐(0) 编辑

Dom操作

摘要: DOM操作 DOM样式修改 需要哪些技术: 1. 如何使用JS创建节点 2. 如何设置节点的样式、属性? 3. 如何在已存在的节点内部添加子节点 4. 如何清空节点内部子节点 达到上述效果 html <!DOCTYPE html> <head> <meta charset="utf-8" /> <l 阅读全文

posted @ 2022-04-27 21:13 RicardoSimple 阅读(27) 评论(0) 推荐(0) 编辑

JSBom

摘要: BOM 页面交互过程 Bom 我们知道为了让浏览器显示出来,必须要在浏览器中键入网址,敲击回车,浏览器能自动帮我们渲染网页内容,和浏览器渲染有关的对象,我们叫做浏览器对象模型(BOM) BOM是由一系列相关对象构成,每个对象都提供了很多方法和属性 但BOM缺乏标准,BOM属于约定俗成,比如chrom 阅读全文

posted @ 2022-04-27 21:12 RicardoSimple 阅读(36) 评论(0) 推荐(0) 编辑

JS对象

摘要: 对象是JS的核心概念,也是最重要的数据结构 什么是对象 简单说,对象就是一组键值对(key-value)的集合,是一种无序的复合数据集合 大括号:定义一个对象 person:定义的对象被赋值给person,则person指向这个对象 name:'henry'/age=18:键值对,键值用:分开 一个 阅读全文

posted @ 2022-04-27 21:11 RicardoSimple 阅读(65) 评论(0) 推荐(0) 编辑

JS函数

摘要: 函数是一段可以反复调用的代码块 JS中,函数是头等对象(first-class)也可以称其方法 获取随机数 Math.random() const num = Math.random(); 这是JS的内置函数,Math是一个内置对象,用于执行数学任务 这行代码可以获得0到1(不包括1)之间的随机值 阅读全文

posted @ 2022-04-27 21:10 RicardoSimple 阅读(26) 评论(0) 推荐(0) 编辑

JS基础

摘要: 认识JavaScript 是一种专为网页设计的脚本语言 JavaScript主要由三部分组成 核心(ECMAScript) 文档对象模型(DOM) 浏览器对象模型(BOM) js的书写位置 与css类似,分为html内部和外部 JavaScript写在html内部 使用标签可以将JavaScript 阅读全文

posted @ 2022-04-27 21:09 RicardoSimple 阅读(27) 评论(0) 推荐(0) 编辑

微博底部栏分析

摘要: 微博底部栏的开发和副导航类似 justify-content: space-between; 主要使用flex的水平布局 第二项是头像,宽度不一样 footer.footer { .item { // 将每一项的宽度设置为固定宽度 // px2rem是处理尺寸的自定义函数 width: px2rem 阅读全文

posted @ 2022-04-27 21:07 RicardoSimple 阅读(43) 评论(0) 推荐(0) 编辑

消息布局分析

摘要: 可以划分为灰色的content和白色的padding,所有的微博都适用这个布局,不同的是content的内容 content部分被分为上中下三个部分 <div class="container"> <header></header> <main></main> <footer></footer> < 阅读全文

posted @ 2022-04-27 21:06 RicardoSimple 阅读(28) 评论(0) 推荐(0) 编辑