- 博客(37)
- 收藏
- 关注
原创 Vue面试题
全局指令:通过Vue.directive()函数注册一个全局的指令局部指令:通过组建的directives属性,对该组件添加一个局部的指令创建全局指令:需要传入指令名称以及一个包含指令钩子函数的对象,该对象的键即钩子函数的函数名,值即函数体,钩子函数可以有多个。// 注册全局自定义指令// 在绑定元素的时候会被调用// 操作DOM// 访问指令的值和参数console.log('指令的值: ', binding.value);
2023-08-20 17:18:35
238
原创 JavaScript面试题
闭包就是能够读取其他函数内部变量的函数。闭包基本上就是一个函数内部返回一个函数。闭包有三个特性:函数嵌套函数函数内部可以引用外部的参数和变量参数和变量不会被垃圾回收机制回收使用场景:应用场景,设置私有变量的方法不适用场景:返回闭包的函数是个非常大的函数工厂方法、构造函数方法、原型方法、组合使用构造函数和原型方法。事件代理又称之为事件委托。就是把原本需要绑定的事件委托给父元素,让父元素担当事件监听的职务。数据封装类对象:Object、Array、Number、Boolean、String。
2023-07-10 17:09:17
225
原创 webpack5学习笔记
开发模式顾名思义就是我们开发时使用的模式。这个模式下我们主要做两件事:1.编译代码,使浏览器能识别运行开发时我们有样式资源、字体图标、图片资源、html资源等,webpack默认不能处理这些资源,所以我们要加载配置来编译这些资源2.代码质量检查,树立代码规范提前检查代码的一些隐患,让代码运行时能更加健壮。提前检查代码规范和格式,同意团队编码风格,让代码更优雅美观。Webpack 本身是不能识别样式资源的,所以我们需要借助 Loader 来帮助 Webpack 解析样式资源。
2022-10-19 22:53:59
645
1
原创 解决webpack : 无法加载文件 C:\Users\XXX\AppData\Roaming\npm\webpack.ps1因为在此系统上禁止运行脚本
解决webpack : 无法加载文件 C:\Users\XXX\AppData\Roaming\npm\webpack.ps1因为在此系统上禁止运行脚本
2022-10-13 14:55:47
785
原创 Vue.config.productionTip = false为什么不起作用?如何解决?
Vue.config.productionTip = false为什么不起作用?如何解决?
2022-09-22 21:51:37
7037
10
原创 算法精选之双指针
Input: nums1 = [1,2,3,0,0,0], m = 3, nums2 = [2,5,6], n = 3 Output: nums1 = [1,2,2,3,5,6]已知有且只有一对解。双指针,指的是在遍历对象的过程中,不是普通的使用单个指针进行访问,而是使用两个相同方向(快慢指针)或者相反方向(对撞指针)的指针进行扫描,从而达到相应的目的。,两个指针以不同的策略移动,直到两个指针的值相等(或其他特殊条件)为止。也是双指针,但是两个指针从同一侧开始遍历数组,将这两个指针分别定义为。
2022-09-22 20:02:42
119
原创 算法精选(二)
有一群孩子和一堆饼干,每个孩子有一个饥饿度,每个饼干都有一个大小。每个孩子只能吃最多一个饼干,且只有饼干的大小大于孩子的饥饿度时,这个孩子才能吃饱。求解最多有多少孩子可以吃饱。输入输出样例:输入两个数组,分别代表孩子的饥饿度和饼干的大小。输出最多有多少孩子可以吃饱的数量。Output: 2。
2022-09-22 09:59:07
205
原创 vue.js not detected问题解决
最近在看vue的时候,发现之前装过的vuedevtools提示vue.js is not detected。
2022-09-19 19:47:14
8033
3
原创 Github相关知识
开源是指不仅提供程序还提供程序的源代码,闭源是指只提供程序,不提供源代码。开源许可协议开源并不意味着完全没有限制,为了限制使用者的使用范围和保护作者的权利,每个开源项目都应该遵守开源许可协议Github是全球最大的开源项目托管平台。因为只支持Git作为唯一的版本控制工具,故名GitHub。为自己喜欢的开源项目做贡献I(Pull Request)和开源项目的作者讨论Bug和提需求(lssues)把喜欢的项目复制一份作为自己的项目进行修改(Fork)创建属于自己的开源项目。
2022-09-19 14:05:34
438
原创 Git和Github的使用
Git是一个开源的分布式版本控制系统,是目前世界上最先进、最流行的版本控制系统。可以快速高效地处理从很小到非常大的项目版本管理。特点:项目越大越复杂,协同开发者越多,越能体现出Git的高性能和高可用性!解决的问题:记录了每次修改的:版本,内容,操作用户,修改时间,文档名等。
2022-09-16 22:41:09
429
原创 NPM知识总结
npm(全称Node Package Manager,即node包管理器)是Node.js默认的、以JS编写的软件包管理器npm来分享和使用代码已成前端的标配。官网:https://www.npmjs.comnpm被全球超过1100万开发人员所依赖拥有超过一百万个软件包,是世界上最大的软件注册表cmd.exe里运行命令。
2022-09-15 11:13:29
393
原创 HTTP详细讲解
客户端与服务器之间要实现网页内容的传输,则通信的双方必须遵守网页内容的传输协议。网页内容又叫做超文本,因此网页内容的传输协议又叫做超文本传输协议。
2022-09-13 19:53:43
1143
原创 JavaScript 字符串(String) 对象
我们可以使用对象字面量中的扩展运算符、使用数组解构赋值语法中的剩余模式或Array.from实用程序将字符串正确转换为字符数组。原始值可以使用 JavaScript 的属性和方法,因为 JavaScript 在执行方法和属性时可以把原始值当作对象。该split方法可能是将字符串转换为字符数组的常用方法,但它不处理采用两个代码单元的字符。字符串的索引从零开始, 所以字符串第一字符为 [0],第二个字符为 [1], 等等。这是将字符串扩展为字符数组的示例。语法可以将数组或可迭代对象中的值解包为不同的变量。
2022-09-03 19:21:33
285
原创 Javascript中改变函数内部this指向的方法:call()、apply()、bind()
都可以改变函数内部的 this指向call和apply会立即调用函数,返回值就是函数执行后的返回值,并且改变函数内部的this指向call和apply传递的参数不一样,call传递参数,apply必须数组形式bind不会立即调用函数,返回值是一个函数,改造后的原函数拷贝,可以改变函数内部this指向bind是返回对应函数,便于稍后调用;apply、call则是立即调用call和bind传递的参数为新的this指向和原函数的其他参数,apply传递的参数为新的this指向和一个数组call。
2022-08-24 14:25:07
330
原创 CSS3中的边框图片
为了实现丰富多彩的边框效果,在css3中,新增了 border-image 属性,这个新增属性允许指定一副图像作为元素的边框。边框图片的使用场景盒子大小不一,但是边框样式相同,此时就需要边框图片来完成,不是背景图片,而是用边框图片来实现。
2022-08-22 14:37:47
505
原创 从1-30中选出5个能被2整除的随机数,并对他们从大到小排序(冒泡排序),最后输出一个数组。
从1-30中选出5个能被2整除的随机数,并对他们从大到小排序(冒泡排序),最后输出一个数组。
2022-07-25 09:00:42
432
原创 移动web开发之rem布局
rem基础rem单位rem (root em)是一个相对单位,类似于em,em是父元素字体大小。不同的是rem的基准是相对于html元素的字体大小。比如,根元素(html)设置font-size=12px; 非根元素设置width:2rem; 则换成px表示就是24px。/* 根html 为 12px */html { font-size: 12px;}/* 此时 div 的字体大小就是 24px */ div { font-size: 2rem;}...
2022-05-07 09:30:00
155
原创 移动端WEB开发之响应式布局
1.0 响应式开发原理1.1 响应式开发原理就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的。设备的划分情况: 小于768的为超小屏幕(手机) 768~992之间的为小屏设备(平板) 992~1200的中等屏幕(桌面显示器) 大于1200的宽屏设备(大桌面显示器) 1.2 响应式布局容器响应式需要一个父级做为布局容器,来配合子级元素来实现变化效果。原理就是在不同屏幕下,通过媒体查询来改变这个布局容器的大小,再改变里面子
2022-05-06 22:38:39
167
原创 什么是栅格系统?Bootstrap执行栅格操作
栅格系统简介栅格系统英文为“grid systems”,也有人翻译为“网格系统”,它是指将页面布局划分为等宽的列,然后通过列数的定义来模块化页面布局。Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列。栅格系统用于通过一系列的行(row)与列(column)的组合来创建页面布局,你的内容就可以放入这些创建好的布局中。按照不同屏幕划分为1~12 等份。● 行(row) 必须放到containe
2022-05-06 16:57:33
2662
原创 Bootstrap前端开发框架【使用教程】
Bootstrap 来自 Twitter(推特),是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS 和 JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。中文官网:http://www.bootcss.com/官网:http://getbootstrap.com/推荐使用:http://bootstrap.css88.com/框架:顾名思义就是一套架构,它有一套比较完整的网页功能解决方案,而且控制权在框架本身,有预制样式库、组件和插件。使用者要按照框..
2022-05-06 10:26:24
8561
原创 移动web开发流式布局
1.0 移动端基础1.1浏览器现状PC端常见浏览器:360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、搜狗浏览器、IE浏览器。移动端常见浏览器:UC浏览器,QQ浏览器,欧朋浏览器,百度手机浏览器,360安全浏览器,谷歌浏览器,搜狗手机浏览器,猎豹浏览器,以及其他杂牌浏览器。国内的UC和QQ,百度等手机浏览器都是根据Webkit修改过来的内核,国内尚无自主研发的内核,就像国内的手机操作系统都是基于Android修改开发的一样。总结:兼容移动端主流浏览器,处理Webkit内核..
2022-04-26 16:50:30
118
原创 移动端基础知识
1 移动端基础1.1浏览器现状PC端:360浏览器、谷歌浏览器、火狐浏览器、QQ浏览器、百度浏览器、QQ浏览器、搜狗浏览器、IE浏览器移动端:UC浏览器、QQ浏览器、欧朋浏览器、百度手机浏览器、360安全浏览器、谷歌浏览器、搜狗手机浏览器、猎豹浏览器、以及其他杂牌浏览器国内的UC和QQ、百度等手机浏览器都是根据Webkit修改过来的内核,国内尚无自主研发的内核,就像国内的手机操作系统都是基于Android修改开发的一样。总结:兼容移动端主流浏览器,处理Webkit内核浏览器即可。1.
2022-04-24 21:32:26
280
原创 为什么 transform-style: preserve-3d;不起效果
在练习下面的3D转换时,正常效果本来应该是下面这样的鼠标碰到他后,会翻转过来,背面在上,变成下面这样但是小编在练习的时候去出现了另一种情况不知道会不会有人和小编一样在练习CSS3的3D转换时,也会遇到这样的问题,就是transform-style: preserve-3d;没有起到效果,就类似下面的效果翻转过来是这样的这就让小编百思不得其解,为什么会这样呢?原来是因为小编忘记加backface-visibility: hidden;(背面隐藏)这个属性了..
2022-04-19 14:54:12
2866
11
原创 CSS 过渡(重点)
过渡(transition)是CSS3中具有颠覆性的特征之一,我们可以在不使用 Flash 动画或JavaScript 的情况下,当元素从一种样式变换为另一种样式时为元素添加效果。过渡动画:是从一个状态渐渐的过渡到另一个状态可以让我们页面更好看,更动感十足,虽然 低版本浏览器不支持(ie9以下版本)但是不会影响页面布局。我们现在经常和:hover一起搭配使用。 transition: 要过渡的属性 花费的时间 运动曲线 何时开始;1、属性:想要变化的CSS属性, 宽度高度 背景颜色 内
2022-03-04 20:34:42
2302
1
原创 CSS其他特性(了解)图片模糊处理
CSS3滤镜filterfilter CSS属性将模糊或颜色偏移等图形效果应用于元素。 filter: 函数(); 例如:filter:blur(5px); blur模糊处理 数值越大越模糊不加模糊时代码及图片是这样的<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewpo
2022-03-04 19:32:41
337
2
原创 伪元素选择器使用场景
1:伪元素字体图标<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>伪元素选择器使用场景-字体图标</title> &l...
2022-03-04 19:21:29
291
1
原创 字体图标 iFonts
1.1字体图标的产生字体图标使用场景:主要用于显示网页中通用,常用的一些小图标。精灵图是有诸多优点的,但是确定很明显。1、图片文件还是比较大的。2、图片本身放大和缩小会失真。3、一旦图片制作完毕想要更换非常复杂。此时,有一种技术的出现很好的解决了以上问题,就是字体图标iconfont。字体图标可以为前端工程师提供一种方便高效的图标使用方式,展示的是图标,本质属于字体。1.2字体图标的优点 轻量级:一个图标字体要比一系列的图像要小。一旦字体加载了,图标就会马上渲染出来,减
2022-03-03 09:52:24
559
2
原创 定位 position 标签
了解position从字面上来看,position即“位置”的意思,position作用是建立元素布局。在介绍position之前,先来了解一下文档流。文档流又称正常流,是默认情况下HTML元素排版布局过程中元素会自动按照自上而下或从左往右进行流式排放的一种顺序。而position作用就是让指定元素脱离文档流,且相对于它在文档流中默认位置偏移(或不动)。position的属性值及应用position有有如下几个属性:static:默认值。没有定位,元素出现在正常流中(忽略 t
2022-03-03 09:48:39
1484
原创 为什么css设置的样式没有显示出来?
我们在写CSS样式的时候有可能出现这样的问题就是说写完样式后样式却没有发生改变,如果代码没有问题那么究竟是什么原因导致了此类问题呢?排查css样式不起作用的方法步骤:首先,先试一下清除缓存,重启浏览器等手段,无效后再进行进一步排查。接着按以下流程排查:以下是排查以及修改方法:再次提醒在排查前先试一下清除缓存,重启浏览器等手段,无效后再进行进一步排查。有可能自己什么都没有做错,就是因为缓存或者浏览器的问题导致,重置一下也许问题就解决了。css样式不起作用的常见原因:1、未关联外
2022-02-25 14:23:19
12280
原创 盒模型属性-width height-padding-border-margin
宽度 width:作用:设置可以添加元素内容的区域的宽度。属性值:特殊应用:• 如果一个元素不添加width 属性,默认属性值为auto,不同的元素浏览器会根据其 特点自动计算出实际宽度,例如<div>元素等独占一行的,其 width 属性的值会自 动撑满父元素的 width 区域,如果是<span>元素等不需要独占一行的,其 width 属性的值是内部元素内容自动撑开的宽度。• <body>元素比较特殊,不需要设置 width 属性.
2022-02-25 10:00:00
954
原创 总结在网页搭建过程中常用标签(二)
<input>标签用于搜集用户信息。根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。<textarea>标签用于定义多行的文本输入控件。该控件中可以容纳无限数量的文本,文本的默认字体是等宽字体。我们可以通过cols和rows属性来规定textarea的尺寸。...
2022-02-24 14:17:55
141
原创 总结在网页搭建过程中常用标签(一)
<div>标签称为区隔标记。作用:设定字、画、表格等的摆放位置。<img>标签是使用来在网页中嵌入一幅图像。从技术上讲,图像并不是插入到网页中,而是链接到网页中,<img>标签的作用是为被引用的图像创建占位符。<img>标签在网页中很常用,比如,引入一个logo图片、按钮背景图片、工具图标等等。只要是有图片的地方,源代码中基本都有<img>标签(除一些背景图片以外)。<img src="被引用图像的地址" alt="图像的
2022-02-24 09:55:22
529
原创 网页布局之盒子模型
1、网页布局的过程 先准备好相关的网页元素,网页元素基本都是盒子box 利用css设置好样式,摆放到合适的位置上去 往盒子里面装内容 本质就是利用css摆放盒子2、盒子模型的组成(Box Model)border 边框content 内容padding 内边距margin 外边距3、边框border边框有三部分组成:宽度、样式、颜色border-width:单位一般是pxborder-style:solid、dotted、dashed、doubl...
2021-12-08 09:03:24
731
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人