- 博客(57)
- 收藏
- 关注
RSS订阅原创 vue3+TypeScript前端开发
reactive的对象不能直接修改，ref的对象就可以直接修改 car.value = {brand:'aotuo',price:1}就是以JS或TS结尾的文件，以use开头export default 后面跟值、也可以跟函数function（）{}
2024-07-23 19:33:04
1119
原创 JQuery 入门
仓库:可以把很多东西放到这个仓库里面。找东西只需要到仓库里面查找就可以JavaScript 库：即library，是一个封装好的特定的集合（方法和函数）。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画animate，hide、show比如获取元素jQuery 就是为了快速方便的操作dom，里面基本都是函数常见的JavaScript 库jQueryprototypeYUIDojoExt JS移动端的zepto。
2024-05-28 22:16:13
382
原创 本地存储。
3、容量较大，sessionStorage 约5m、localStorage 约20m。4、只能存储字符串，可以将JSON.stringify()编码后存储。生命周期永久生效，除非手动删除 否则关闭页面也会存在。可以多窗口（页面）共享（同一浏览器可以共享）2、设置、读取方便、甚至页面刷新不丢失数据。2、在同一个窗口（页面）下数据可以共享。1、生命周期为关闭浏览器窗口。1、数据存储在用户浏览器中。3、以键值对的形式存储使用。以键值对的形式存储使用。
2024-05-21 22:05:12
221
原创 移动端网页特效
移动端兼容性好，可以放心使用原生JS书写效果，但是移动端也有自己独特地方。比如触屏事件 touch（触摸事件）触屏事件可响应用户手指对屏幕或者触控板操作。JS插件 是JS文件，特点：他一般是为了解决某个问题而专门存在，其功能单一且较小animate.js 算是一个最简单的插件不同视频格式文件，可以通过source 解决。但外观播放暂停等可以使用插件来制作框架大而全，插件小而专一。
2024-05-21 22:04:49
529
原创 PC端网页特效
offset翻译过来就是偏移量，我们使用offset 系列相关属性可以动态的得到该元素的位置（偏移）、大小等获得元素距离带有定位父元素的位置获得元素自身的大小（宽度高度）注意： 返回的数值都不带单位主要用法：1、offset 系列经常用于获得元素位置 offsetLeft offsetTop2、client 经常用于获取元素大小 clientWidth clientHeight3、scroll经常用于获取滚动距离 scrollTop scrollLeft。
2024-05-17 20:45:34
901
1
原创 BOM 浏览器对象模型
BOM即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是windowBOM缺乏标准，JavaScript语法标准化组织是ECMA，DOM标准化组织是W3C，BOM最初是Netscape浏览器标准的一部分2、BOM构成BOM 比DOM大，它包含DOMwindow 对象是浏览器的顶级对象，它具有双重角色1、它是JS 访问浏览器窗口的一个接口2、他是一个全局对象。定义在全局作用域中的变量、函数都会变成window对象的属性和方法。
2024-05-17 20:45:22
1055
原创 事件高级。
事件委托的原理：不是每个子节点单独设置时间监听器，而是事件监听器设置在其父节点上，然后利用冒泡原理影响设置每个子节点。注意：keydown 和keypress 在文本框里面的特点：他们两个触发时，文字还没有落入文本框中。事件冒泡：IE最早提出，事件开始时由最具体的元素接收，然后逐级向上传播到dom最顶层节点的过程。2、onKeypress 和前面两个区别是，他不识别功能键，比如左右箭头，shift等。对象代表事件的状态，跟事件相关的一系列信息的集合。里面的事件类型是字符串，必定加引号，而且不带on。
2024-05-12 16:14:14
760
原创 DOM 文档对象模型
DOM 文档对象模型简称，是W3C组织推荐的处理可扩展标记语言的标准编程接口W3C已经定义了一系列的DOM接口，通过这些接口可以改变网页的内容、结构、样式4.5 排他思想自定义属性目的：是为了保存并使用数据。有些数据可以保存到页面中而不用保存到数据库中。自定义属性获取是通过getAttribute（‘属性’）获取h5新增的获取自定义属性的方法 他只能获取data-开头的dataset 是一个集合存放了所有以data开头的自定义属性。
2024-05-12 16:13:35
1230
原创 Web APIs
JavaScript由 ECMAScript(JavaScript语法）,DOM（页面文档对象模型）,BOM（浏览器对象模型）现阶段我们主要针对于浏览器讲解的常用API，主要针对浏览器做交互效果。因为web API很多，所以我们将这个阶段称为 web APIS。（BOM 和·DOM）
2024-05-04 15:02:11
268
原创 JavaScript 简单类型与复杂类型
函数的形参也可以看做一个变量，当我们把一个值类型变量作为参数传给函数的形参时，其实是把变量在栈空间里的值复制一份给形参，那么在方法内部对形参做任何修改，都不会影响到外部变量。2、堆（操作系统）：存储复杂类型（对象），一般由程序员分配释放，若程序员不释放，由垃圾回收机制回收。引用类型：复杂数据类型，在存储时变量中存储的仅仅是地址（引用），因此叫做引用数据类型。值类型：简单数据类型，在存储时变量中存储的是值本身，因此叫做值类型。引用类型变量（栈空间）里存放的是地址，真正的对象实例存放在堆空间中。
2024-05-04 14:50:43
282
原创 JavaScript 对象
调用对象的方法 sayHi 对象名.方法名 obj.sayHi（）；对象字面量：就是 { } 里面包含了表达这个具体事物（对象）的属性和方法。构造函数就是把我们对象里面一些相同的属性和方法抽象出来封装到函数里面。在JavaScript 中，对象是一组无序的相关属性和方法的集合。属性 在对象里面的不需要声明的 使用时候必须是 对象.属性。我们利用 等号 = 赋值的方法 添加对象的属性和方法。3、执行构造函数里面的代码 给这个空对象添加属性和方法。利用字面量、new Object 、构造函数。
2024-04-26 15:46:35
475
原创 JavaScript 预解析
(1)预解析 JS引擎会把JS里面所有的var 还有function 提升到当前作用域的最前面。（1）变量提升 就是把所有的变量声明提升到当前的作用域最前面 不提升赋值操作。JavaScript解析器在运行JavaScript 代码的时候分为两步：预解析和代码执行。（2）函数提升 就是把所有的函数声明提升到当前作用域的最前面 不调用函数。预解析分为 变量预解析（变量提升）和 函数预解析（函数提升）函数表达式调用必须写在函数表达式的下面。结果为undefined。
2024-04-24 21:34:33
390
2
原创 JavaScript 作用域
作用域链：内部函数访问外部函数的变量，采取的是链式查找的方式来决定取哪个值，这种结构我们称为作用域链。局部作用域（函数作用域）：在函数内部就是局部作用域，这个代码的名字只在函数内部起作用。一段程序代码中所用到的名字并不总是有效的和可用的，而限定这个名字的。全局作用域就是整个script标签或是一个单独的JS文件。JS的作用域（es6）之前：全局作用域 局部作用域。1、全局变量：在全局作用域下的变量，全局都可以使用。作用域的使用提高了程序逻辑的局部性，减少名字冲突。JS也是在es6新增的块级作用域。
2024-04-24 21:34:10
210
原创 JavaScript 函数
如果实参的个数小于形参的个数，形参看做是不用声明的变量 num2 是一个变量但没有接收值，结果就是undefined ，此。return ：不仅可以退出循环，还能够返回 return 语句中的值，同时还可以结束当前的函数体内的代码。函数表达式声明方式跟声明变量差不多，只不过变量里面的存的是值 而 函数表达式里面存的是函数。function 声明函数的关键字，全部小写，函数名一般是动词，函数不调用自己不执行。function 函数名（形参1，形参2.。如果实参的个数多于形参的个数 会取到形参的个数。
2024-04-24 21:33:55
616
原创 JavaScript 数组
数组（array） 是一个数组的集合，其中每一个数据被称作。索引（下标）： 用来访问数组元素的序号（下标从0开始）可以通过修改length 长度以及索引号增加数组元素。一次比较两个元素，如果他们的顺序错误就把他们交换过来。不要直接给数组名赋值，否则里面的数组元素都没有了。for 里面的 i 是计数器，当索引号使用，数组的长度是元素个数 arr.length。还可以利用索引号替换原来的数组元素。声明数组并赋值称为数组的初始化。数组里面的数据一定用逗号分隔。声明变量未给值，默认值是。数组的字面量是方括号【】
2024-04-20 11:45:01
373
原创 JavaScript 流程控制-循环
1、求1-100之间所有数的平均值 需要一个sum 和的变量 还需要一个平均值 average 变量。2、求1-100之间所有偶数和奇数的和 我们需要一个偶数的和变量 even 还需要一个奇数 odd。’ 换成 str += j + 'x' + i + ‘=’ + i + j +‘\t’;在for循环中再嵌套一个 for 循环，这样的for循环称为双重for 循环。外层的操作表达式）{由循环体及循环的终止条件组成的语句被称为。外层循环循环一次，里层循环执行全部。，能否继续重复执行，取决于循环的。
2024-04-19 20:31:18
533
原创 JavaScript 流程控制-分支
执行思路：利用我们的表达式的值 和 case 后面的选项值相匹配 如果匹配得上，就执行该case里面的语句 如果没有匹配的上，那么执行default 里面的语句。由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果。如果if 条件表达式结果为假 则不执行大括号里面的语句 则执行if 语句后面的代码。如果上面的所有条件表达式都不成立，则执行else 里面的语句。执行思路：如果if 里面的条件表达式结果为真 true 则执行大括号里面的 执行语句。
2024-04-19 20:30:57
671
原创 JavaScript 运算符
1、逻辑与短路运算 如果表达式1 结果为真，则返回表达式2；2、逻辑或短路 如果表达式1 结果为真，则返回的是表达式1；在JavaScript·中，递增（++）和递减（--）既可以放在变量前面，也可以放在变量后面。2、逻辑或 || 两侧都为false 结果才为false 只要一侧为true 结果就是true。逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。两个数据进行比较时所使用的运算符，比较运算后会返回一个布尔值作为比较结果。可以确定结果时，就不再继续运算右边的表达式的值。
2024-04-17 15:40:54
461
原创 JavaScript
浏览器分为 渲染引擎 和 JS引擎 两部分渲染引擎： 用来解析HTML 与css ，俗称内核 ，比如Chrome的blinkJS引擎： 也称为JS解释器。用来读取网页中的JavaScript的代码，对其处理后运行，比如Chrome 浏览器 的v8浏览器本身并不会执行JS代码，而是通过内置JavaScript引擎（解释器）来执行JS代码。JS引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以JavaScript语言归为脚本语言，会逐行解释执行。
2024-04-13 09:57:15
611
原创 移动WEB开发之响应式布局
Bootstrap 来自 Twitter（推特），是目前最受欢迎的前端框架。Bootstrap是基于html、css和JavaScript的，使web开发更加快捷框架：就是一套架构，他有一套比较完整的网页功能解决方案，而且控制权在框架本身，有预制样式库、组件和插件。使用者要按照框架所规定的某种范围进行开发。栅格系统，是指将页面布局划分为等宽的列，然后通过列数的定义来模块化页面布局。Bootstrap 提供了一套响应式的、移动设备优先的流式栅格系统，随着屏幕或视口的增加，系统会自动分为最多12列。
2024-04-11 15:26:13
1038
原创 移动WEB开发之流式布局
4、contain 把图像扩展至最大尺寸，以使其宽度高度完全适应内容区域（高宽度等比例拉伸 当宽度或高度铺满div盒子就不再进行拉伸 可能有部分空白区域）移动端可以全部用CSS3盒子模型，PC端如果完全需要兼容，我们就用传统模式，如果不考虑兼容性就选择css3盒子模型。1、通过盒子的宽度设置成百分比来根据屏幕的宽度来进行伸缩，不受固定像素的限制，内容向两侧填充。4、一个px的能显示的物理像素点的个数，称为物理像素比或屏幕像素比。1、物理像素点指的是屏幕显示的最小颗粒，是物理真实存在的。
2024-03-19 20:32:00
876
原创 CSS 2D转换 动画 3D转换
是CSS3中具有颠覆性的特征之一，可以实现元素的位移(translate)、旋转(rotate)、缩放（scale）等效果。左手的拇指指向y轴的正方向，其余手指的弯曲方向就是该元素沿着y轴旋转的方向（正值）2、如果里面的参数是% 移动的距离是 盒子自身的宽度或者高度来对比的。： 就是z轴，物体距离屏幕的距离，z轴越大（正值）我们看到的物体越大。X轴： 水平向右 X轴右边是正值，左边是负值。： 就是视距，视距是一个距离人的眼睛到屏幕的距离。Y轴： 垂直向下 Y下面是正值，上面是负值。
2024-03-19 20:30:55
934
原创 CSS高级技巧
精灵图主要针对小的背景图片使用，主要借助于背景位置实现-background-position。为了有效减少服务器接受和发送请求的次数，提高页面的加载速度，出现了CSS精灵技术（CSS Sprites、CSS雪碧）。2、鼠标经过某个盒子的时候，提高当前盒子的层级即可（如果没有定位，则加相对定位（保留位置），如果有定位，则加z-index）精灵图缺点：图片文件比较大，图片本身放大和缩小会失真，一旦图片制作完毕想要更换非常复杂。图片表单都属于行内块元素，默认的vertical-align是基线对齐。
2024-02-23 20:45:41
1047
原创 HTML5和CSS3提高
nth-child（n）里面的n可以是数字（选择第n个子元素，从1开始）、关键字（even偶数，odd奇数）、公式（从0开始计算，但是第0个元素或者超出了元素的个数会被忽略）nth-of-type 会把指定的盒子排列序号，执行时候先看 div指定的元素 之后看 ：nth-of-type（1）第几个盒子。nth-child会把所有的盒子都排列序号，执行的时候首先看 ：nth-child（1） 之后回去看前面div。增加了一些新的标签，新的表单，新的表单属性，IE9+以上版本的浏览器才支持。
2024-02-23 20:45:11
3271
原创 CSS定位
语法： 选择器 { z-index：1；数值可以是正整数、负整数或0，默认是auto，数值越大盒子越靠上如果属性相同，则按照书写顺序后来居上。数字后面不能加单位只有定位的盒子才有z-index属性。
2024-02-11 20:36:57
987
原创 CSS（2）
1.参数是方位名词，如果指定的两个值都是方位名词，则两个值前后顺序无关，如left top 和top left效果一样。2.参数是精确单位，那么第一个肯定是x坐标，第二个肯定是y坐标。3.参数是混合单位，如果指定的两个值是精确单位和方位名词混合使用，则第一个值是x坐标，第二个一定是y坐标。子标签会继承父标签的某些样式，text-,font-,line-这些元素开头的可以继承，以及color属性。用于向某些选择器添加特殊的效果，比如给链接添加特殊效果，或选择第1个，第n个元素。如果给选择器后面的样式里写！
2024-01-28 15:18:01
992
原创 CSS层叠样式表
目标：CSS，CSS基础选择器，设置字体样式，文本样式，CSS三种引入方式，使用Chorme调试工具调试样式CSS是层叠样式表（Cascading Style Sheets）简称,有时会称为CSS样式表或级联样式表，CSS也是一种标记语言，主要用于设置HTML页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框样式、边距等）以及版面的布局和外观显示样式。CSS规则由两个主要的部分构成：选择器以及一条或多条声明。格式例如p{
2024-01-25 13:45:34
2060
原创 HTML标签导读下（1）
跨行合并：rowspan=“合并单元格的个数” 跨行：最上侧单元格为目标单元格，写合并代码。跨列合并：colspan="合并单元格的个数" 跨列：最左侧单元格为目标单元格，写合并代码。用来收集信息，一个完整表单信息通常由表单域、表单控件（表单元素）和提示信息三个部分构成。标签表示HTML表格的表头部分，一般表头单元格位于表格的第一行，内容会加粗居中显示。表单域就是form标签，在我们写表单元素之前应该有个表单域把他们进行包含。name属性后面的值，是自定义的，name作用用于区别不同的表单。
2023-12-23 18:05:10
568
1
原创 HTML标签（2）
target打开窗口的方式，默认值是 —self当前窗口打开页面 —blank 新窗口打开页面。例如 “D：\web\img\logo.gif”或者图片的网址。是指目录下的绝对位置，直接到达目标位置，通常从盘符开始的路径。属性之间不分顺序，标签名与属性、属性与属性之间以空格分开。属性采取键取值对的格式，即属性 = "属性值"图像标签可以拥有多个属性，必须写在标签名后面。标签用于定义HTML页面中的图像。标签作用是从一个页面链接到另一个页面。（属性就是标签的特性），它用于指。
2023-12-21 21:06:27
557
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人