前端学习系列
关注
分享
扫一扫
文章平均质量分 80
每天一更前端学习总结小知识、让小白从零快速了解前端知识、避开一些常见的坑。栏目内容来自Github、掘金等各大网站而后由博主总结发布。
程序员三木
[优快云全栈领域优秀创作者| 阿里云博客社区专家博主] 作为某云服务提供商的后端开发人员，我将在这里与大家简要分享一些实用的开发小技巧。在我的职业生涯中积累了丰富的经验，希望能通过这个博客与大家交流、学习和成长。
展开
-
手写防抖节流
文章目录手写前端常用技巧-防抖节流防抖节流1. 首节流2. 尾节流3. 首尾节流总结手写前端常用技巧-防抖节流防抖：当持续触发事件时，一定时间内没有再触发事件，才会在一段时间之后触发事件处理函数。节流：当持续触发事件时，保证一段delay之内，只调用一次函数防抖源代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-eq原创 2021-10-07 17:24:33 · 1886 阅读 · 0 评论 -
websocket使用实践代码指南
文章目录[websocket]([WebSocket - Web API 接口参考 | MDN (mozilla.org)](https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket))前端后端socket.io前端后端[websocket](WebSocket - Web API 接口参考 | MDN (mozilla.org))简单的来说，websocket是用来实现客户端和服务端进行双向连接的，连接之后，服务器可以给客户端主动发数据原创 2021-08-13 17:16:53 · 533 阅读 · 0 评论 -
必知必会的axios学习经(更新中)
文章目录MDN文档HTTP 相关HTTP请求交互的基本过程HTTP 报文请求报文响应报文post 请求体参数格式常见的响应状态码**不同类型的请求及其作用**API 分类queryparams理解XHR区别一般http请求与ajax请求`ajax`的常用APIconstructorpropertiesmethods`axios`--`ajax`的封装1、axios与Axios的关系2、instance 与 axios 的区别3、axios运行的整体流程4、 Axios函数5、Axios.prototypep原创 2021-04-28 21:59:02 · 1290 阅读 · 0 评论 -
剖析require、import、export、exports、module.exports以及export default 的基本用法
文章目录1、预备知识Node.js百度百科通俗的说法模块化系统以及`CommonJs`模块化规范给项目带来的好处AMDCMDUMD2、正文1、require2、import3、export与export default4、exports与module.exportsexports的基本用法1、预备知识要想对require、import 、export、export default、 exports、module.exports了解的更为清楚， 我们不得不先来谈谈Node.js以及AMD、CMD、UMD等原创 2021-03-30 10:45:18 · 1288 阅读 · 0 评论 -
３ｓ学会jsx的基本使用
遇到{ 直到 } 部分当成 js 解析遇到< 直到 > 部分当成 html 解析原创 2021-03-06 14:35:05 · 294 阅读 · 0 评论 -
异步Promise及Async/Await 异步之神详解
目录一、为什么有Async/Await？二、Promise简介2.1 Promise实例2.2 Promise的then和catch2.3 Promise相互依赖2.4 Promise链式写法2.5 链式写法需要注意的地方2.5 链式写法的错误处理2.6 Promise链式中间想返回自定义的值2.7 如何跳出或停止Promise链式2.8 Promise.all三、Async/await介绍3.1 基于Promise的Async/await3.2 async的本质3.3 await的本质与例子3.4 asy原创 2020-11-16 23:39:38 · 660 阅读 · 0 评论 -
JS ES6中export和import史上最全
@[TOC]自动根据文章标题生成目录特别声明：转载于博客园1.Export模块是独立的文件，该文件内部的所有的变量外部都无法获取。如果希望获取某个变量，必须通过export输出，// profile.jsexport var firstName = 'Michael';export var lastName = 'Jackson';export var year = 1958;或者用更好的方式：用大括号指定要输出的一组变量// profile.jsvar firstName =原创 2020-11-12 00:44:29 · 1690 阅读 · 4 评论 -
前端组件之Bootstrap与Ant design of Vue
架构1、前言2、Bootstra跟Ant design对比2.1 简介2.1.1 Bootstrap2.1.2 Ant design2.2 特性2.2.1 Bootstrap2.2.2 Ant Design Of Vue2.3 入门条件BootstrapAnt Design Of Vue2.4 部分组件的显示效果以及代码2.4.1 导航条2.4.2 巨幕2.5 栅格系统3、两个强大组件库的一些共性总而言之1、前言本文仅面向前端初始学习者，当然也欢迎大犇来指正其中错误玩前端的新手，或多或少地会见过并原创 2020-10-28 09:40:19 · 6517 阅读 · 2 评论 -
01、网址带多个参数的
比如一般的网址https://www.baidu.com要带参数的话，先加?，再加参数的键名+=键值eg:URL=www.baidu.com? words=xxxx如果多个参数的话:每个参数名前面加上&URL=www.baidu.com? words=xxxx&id=1原创 2020-10-01 10:51:06 · 842 阅读 · 0 评论 -
js 获取时间戳的方法
第一种方法精确到s，即s后全是0let times = Date.parse(new Date());第二种方法精确到毫秒let times = new Date().getTime();原创 2020-09-22 15:29:36 · 123 阅读 · 0 评论 -
黑马程序员360搜索例子-2020更新代码
很多自学的小伙伴可能都遇到过这样的一个问题，就是代码跟教程的一摸一样，但是视频没错但自己敲出来却错了，原因是多样的，但是软件本身的更新迭代应该是我们优先考虑的，就像日前在B站看的黑马程序员的jQuery的Ajax应用–利用360搜索API制作一个关键词联想的例子。附上代码，避免一些小伙百度不出解决方法。。<!DOCTYPE html><html lang="en"> <head> <meta charset="utf-8" /> &l原创 2020-08-15 21:15:28 · 304 阅读 · 0 评论 -
探索jQuery的ready方法比原生js的window.onload快的奥秘
节点树一、ready() ：页面DOM结构节点加载完成后触发（数据可能没有完全加载）二、load & onload ：页面所有元素（包括图片数据等）加载完成后触发三、window.onload = function(){...}与 $(function(){...})的对比四、测试用例一、ready() ：页面DOM结构节点加载完成后触发（数据可能没有完全加载）// ready的完整写法$(document).ready(function(){...}); // 简写方法1$().read原创 2020-08-01 22:46:42 · 455 阅读 · 0 评论 -
day_06_CSS万物之源（文本格式）以及居中神器
@[TOC]自动根据文章标题生成目录css文本设置常用的应用文本的css样式：color 设置文字的颜色，如： color:red;font-size 设置文字的大小，如：font-size:12px;font-family 设置文字的字体，如：font-family:‘微软雅黑’;font-style 设置字体是否倾斜，如：font-style:‘normal’; 设置不倾斜，font-style:‘italic’;设置文字倾斜font-weight 设置文字是否加粗，如：font-weig原创 2020-07-17 23:35:30 · 172 阅读 · 0 评论 -
day_05_CSS的盒子模型
文章目录1、盒子模型解释2、设置宽高3、设置边框4、设置内间距padding5、设置外间距margin1、盒子模型解释元素在页面中显示成一个方块，类似一个盒子，CSS盒子模型就是使用现实中盒子来做比喻，帮助我们设置元素对应的样式。盒子模型示意图如下：把元素叫做盒子，设置对应的样式分别为：盒子的宽度(width)、盒子的高度(height)、盒子的边框(border)、盒子内的内容和边框之间的间距(padding)、盒子与盒子之间的间距(margin)。2、设置宽高width:200px; /*原创 2020-07-16 09:55:38 · 442 阅读 · 0 评论 -
day04_CSS选择器
常用的选择器有如下几种：1、标签选择器标签选择器，此种选择器影响范围大，建议尽量应用在层级选择器中。举例：*{margin:0;padding:0}div{color:red} <div>....</div> <!-- 对应以上两条样式 --><div class="box">....</div> <!-- 对应以上两条样式 -->2、id选择器通过id名来选择元素，元素的id名称不能重复，所以一个样原创 2020-07-12 23:14:07 · 133 阅读 · 0 评论 -
day03_CSS的基础语法及页面的引用
基础语法css的定义方法是：选择器 { 属性:值; 属性:值; 属性:值;}选择器是将样式和页面元素关联起来的名称，属性是希望设置的样式属性每个属性有一个或多个值。代码示例：/* css注释 ctrl+shift+"/"*/div{ width:100px; height:100px; color:red }css页面引入方法：1、外联式：通过link标签，链接到外部样式表到页面中。– 开发中使用最多的，可以将所有的样式放在一个css文件、便于原创 2020-07-11 19:42:50 · 141 阅读 · 0 评论 -
day02_HTML的布局_常用的标签
一、块元素、内联元素、内联块元素元素就是标签，布局中常用的有三种标签，块元素、内联元素、内联块元素，了解这三种元素的特性，才能熟练的进行页面布局。1、块元素块元素，也可以称为行元素，布局中常用的标签如：div、p、ul、li、h1~h6、dl、dt、dd等等都是块元素，它在布局中的行为：` 1、支持全部的样式 2、如果没有设置宽度，默认的宽度为父级宽度100% 3、盒子占据一行、即使设置了宽度`h1-h6标题标签p段落标签paragraphul、ol、l原创 2020-07-10 16:33:49 · 479 阅读 · 0 评论 -
day01_认识前端_Web 、网页、浏览器
Web、网页、浏览器WebWeb（World Wide Web）即全球广域网，也称为万维网。我们常说的Web端就是网页端。网页网页是构成网站的基本元素。网页主要由文字、图像和超链接等元素构成。当然，除了这些元素，网页中还可以包含音频、视频以及Flash等。我们在浏览器上输入网址后，打开的任何一个页面，都是属于网页。浏览器浏览器是网页运行的平台，常见的浏览器有谷歌（Chrome）、Safari、火狐（Firefox）、IE、Edge、Opera等。关于浏览器的详细介绍，可以看下一篇文章：《浏原创 2020-07-08 20:49:34 · 1297 阅读 · 0 评论