自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(13)
  • 收藏
  • 关注

原创 事件循环解析

js是单线程的,js主要用途是与用户交互,以及操作dom,这就决定了它只能是单线程的。比如说,同时有两个线程,一个线程在dom节点上添加,一个在线程上删除节点,这时浏览器就不知道应该以哪个线程为准,所以为了避免复杂性,所以它就是单线程。单线程就意味着,前一个任务结束,后一个任务才能执行,设计者为了解决这个问题把任务分层两种,一种是同步任务,一种是异步任务。异步任务又区分微任务和宏任务,在异步任务中优先执行微任务(比如promisie),执行完了在去执行宏任务(比如setTimeout定时器这类)。

2024-07-25 15:48:57 140

原创 浏览器的渲染原理解析

css不会阻塞html解析,但js会阻塞html解析,因为下载和解析css是在预解析线程中进行,js代码可能会修改当前dom树,所以dom树生成会暂停。比如说dispaly:none的节点没有几何信息,就不会生成到布局树,又比如使用了伪元素选择器,虽然dom树中不存在这些伪元素,但他们拥有几何信息,所以会生成到布局树中。在这个过程中,很多预设置会变成绝对值,比如说red会变成rgb(255,0,0),相对单位会变成绝对单位,比如em会变成px。完成绘制后,主线程将每个图层的绘制信息交给合成线程。

2024-07-25 15:47:27 239

原创 键值对正选和反选

2022-07-06 11:07:50 81 1

原创 快捷获取方法

// 获取当前时间并打印getCurrentTime() {  let yy = new Date().getFullYear();  let mm = new Date().getMonth()+1;  let dd = new Date().getDate();  let hh = new Date().getHours();  let mf = new Date().getMinutes()<10 ? ‘0’+new Date().getMinutes() : new Date().

2021-11-29 15:41:13 579

原创 2020-12-06

使用 substring()或者slice()函数:split()功能:使用一个指定的分隔符把一个字符串分割存储到数组例子:str=”jpg|bmp|gif|ico|png”; arr=theString.split(”|”); //arr是一个包含字符值”jpg”、”bmp”、”gif”、”ico”和”png”的数组 函数:Join()功能:使用您选择的分隔符将一个数组合并为一个字符串例子:var delimitedString=myArray.join(delimiter); v

2020-12-06 22:08:32 57

原创 2020-12-06

先定义一个字符串 var str = “abbcalgldkjgldgehlgjldf”;*1,indexOf(),返回指定字符创第一次出现的位置。*str.indexOf('a') //结果是02,lastIndexOf(),返回指定字符串最后一次出现的位置。str.lastIndexOf('f') //结果是223,substring(),提取字符串中两个指定索引号之间的字符(两个索引不能为负值)str.substring(0,5) //结果是abbca4,slice(), 提取.

2020-12-06 22:03:18 43

原创 数组的方法

JavaScript中创建数组有两种方式(一)使用 Array 构造函数:var arr1 = new Array(); //创建一个空数组var arr2 = new Array(20); // 创建一个包含20项的数组var arr3 = new Array(“lily”,“lucy”,“Tom”); // 创建一个包含3个字符串的数组(二)var 创建数组var arr4 = []; //创建一个空数组var arr5 = [20]; // 创建一个包含1项的数组var arr6 =

2020-12-04 20:04:01 717

原创 js高级

面向过程理解:亲力亲为优点:性能高面相对象理解:把一个个东西当作对象来使用(对象,往往都是被人封装好的代码)优点:好维护、复用、拓展缺点:性能稍低面向对象和面向过程都是一种思维类类 (构造函数) 模板对象 具体的事物 // 构造函数 function Student(name,age){ this.name = name; this.age = age } var

2020-11-15 19:24:54 73

原创 jq

库自己或者别人封装的js文件jquery pc端的dom操作zepto 移动端的dom操作版本1.x 兼容ie6782.x 使用基于jquery的插件 不兼容ie678(主流使用,稳定)3.x 使用了一些新的语法(阮一峰的es6入门) 不兼容性ie678生产环境 (jq的压缩版本,体积大)用户真实打开页面加载的这个文件开发环境(jq不是压缩版本,体积小)入口函数$(document).ready(function(){ 入口函数})$(function(){ 入口

2020-11-05 19:34:38 83

原创 web api

获取元素通过id获取元素(单个)var ele_id = document.getElementById('id');ele_id 就是一个元素对象通过标签名获取元素(多个)document.getElementsByTagName('div')通过类名获取元素(多个)doccument.getElementsByClassName('red')通过 选择器获取(单个)—常用document.querySelector('选择器')通过 选择器获取(多个)—常用document

2020-11-01 21:14:44 140

原创 js基础

js组成部分ECMAScript 基础语法 js基础阶段DOM 文档对象模型 api阶段 通过js的方式来修改页面上的所有内容活者是css属性BOM 浏览器对象模型 api阶段 跟浏览器功能相关的内容,比如说 回退刷新等等数据类型简单数据类型和复杂数据类型简单数据类型 5种 ----6种 es6语法1、数字型 numberNaN 非数字但是他是数字类型2、字符串类型string凡事被引号包起来的内容都是字符串“444” ‘4444’在html页面结构

2020-10-26 19:23:47 158

原创 web移动端

视口布局视口:页面显示不全,但字大视觉视口:页面显示全,但是字小理想视口:页面显示全,字也大物理像素(在真实大小里面可以放更多的像素点)和真实像素(手机真实的大小)优势:在一定的屏幕下,显示更多的像素,让屏幕效果更加清晰 细腻pc端物理像素===真实像素设备宽度并没有太大的变大,随着科技的变化,能够让移动端显示的效果更加丰富,一个像素点,里面放的物理像素越来越多iphone3G 1:1iphone4-8 xr 11 2:1 手机里面的一个像素点,可以显示2*2个像素ihp

2020-10-10 20:22:42 218

原创 Html和Css3

文本标签加粗 strong倾斜 em删除线 del下划线 ins 相对路径同一级 直接写 还有另外一个写法 ./ 相当于 直接写下一级 /图片名字 或者 /图片文件夹上一级 …/绝对路径本地的绝对路径绝对路径的移植性不好互联网上的绝对路径外部链接a href = 是一个必填项 http://target_self 在原窗口自身打开_blank 在新窗口中打开内部链接href = ‘本地的地址

2020-09-30 08:22:26 893

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除