前端学习笔记
文章平均质量分 93
前端学习笔记
宁阿宁阿宁
这个作者很懒,什么都没留下…
展开
-
【TypeScript】基础内容
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-23e1fLb8-1663844096153)(TS_images/1-1.png)]TypeScript 是一种由微软开发的开源、跨平台的编程语言。它是JavaScript的超集,最终会被编译为JavaScript代码2012年10月,微软发布了首个公开版本的TypeScript,2013年6月19日,在经历了一个预览版之后微软正式发布了正式版TypeScriptTypeScript的作者是安德斯·海尔斯伯格,C#的首席架构师。原创 2022-09-22 18:55:58 · 270 阅读 · 1 评论 -
【jQuery 笔记】基础内容
文章目录1、jQuery 简介2、选择元素,实例方法`filter()``has()``find()``eq()``not()``is()`3、jQuery 函数式写法4、js 和 jQuery 的关系5、取值赋值函数统一性,实例方法`css()``html()``text()``prop()``attr()``click()``addClass()``removeClass()``index()`6、jQuery 从基础开始玩,实例方法`next()``prev()``insertBefore()``be原创 2022-04-20 16:43:16 · 862 阅读 · 0 评论 -
【VUE 笔记】基础内容
文章目录01 初识 Vue1.1 简介1.1.1 官网1.1.2 介绍与描述1.1.3 Vue 的特点1.1.4 与其他 JS 框架的关联1.1.5 Vue周边库1.2 初识 Vue1.2.1 前置工作1.1.2 初始Vue02 Vue 模板语法2.1 插值语法2.2 指令语法03 Vue 数据绑定3.1 Vue 中有2种数据绑定的方式3.2 备注04 el 与 data 的两种写法4.1 el 有两种写法4.2 data 有两种写法4.3 注意05 MVVM 模型原创 2022-04-14 21:56:45 · 379 阅读 · 0 评论 -
【VUE 笔记】进阶内容
Vue 脚手架是 Vue 官方提供的标准化开发工具(开发平台)最新的版本是 4.x文档 Vue CLI如果下载缓慢请配置 npm 淘宝镜像全局安装 @vue/cli切换到创建项目的目录,使用命令创建项目选择使用 vue 的版本启动项目打包项目暂停项目Vue 脚手架隐藏了所有 webpack 相关的配置,若想查看具体的 webpack 配置,请执行src/components/School.vuesrc/components/Student.vuesrc/App.vuesrc/main.jspubl原创 2022-07-22 18:32:43 · 1467 阅读 · 0 评论 -
【CSS3 笔记】基础内容
CSS3 是 CSS2 的升级版本,3只是版本号,它在 CSS2.1 的基础上增加了很多强大的新功能。目前主流浏览器 chrome、safari、firefox、opera、甚至360都已经支持了 CSS3 大部分功能了,IE10以后也开始全面支持 CSS3 了。CSS3 前缀:在编写 CSS3 样式时,不同的浏览器可能需要不同的前缀。它表示该 CSS 属性或规则尚未成为 W3C 标准的一部分,是浏览器的私有属性,虽然目前较新版本的浏览器都是不需要前缀的,但为了更好的向前兼容前缀还是少不了的。可以利用插件打原创 2022-06-07 13:27:28 · 454 阅读 · 0 评论 -
【CSS 笔记】基础内容
文章目录01 CSS 层叠样式表02 CSS 四种引用方式03 CSS 选择器分类04 CSS 字体、背景05 CSS 伪类选择器、伪元素选择器06 CSS 属性选择器07 CSS 关系选择器08 CSS 浮动布局清除浮动方法09 CSS 盒子模型10 display 属性:用来设置元素显示方式11 table 样式12 列表样式13 轮播图14 CSS 定位布局(position)15 网站整体布局双飞翼布局圣杯布局侧边栏固定布局两栏布局左侧固定,右侧自适应左侧自适应,右侧固定两列定宽布局三栏布局中间自适原创 2022-04-17 08:51:24 · 199 阅读 · 0 评论 -
【fetch 笔记】基础内容
必须开启服务器JavaScript 通过 来执行异步请求,这个方式已经存在了很长一段时间。虽说它很有用,但它不是最佳 API。它在设计上不符合职责分离原则,将输入、输出和用事件来跟踪的状态混杂在一个对象里Fetch API 提供了一个 JavaScript 接口,用于访问和操纵 HTTP 管道的部分,例如请求和响应。它还提供了一个全局 方法,该方法提供了一种简单,合乎逻辑的方式来跨网络异步获取资源从 返回的 Promise 将不会拒绝 HTTP 错误状态,即使响应是一个 HTTP 404 或 500。原创 2022-06-07 14:21:37 · 277 阅读 · 0 评论 -
【AJAX 笔记】AJAX 基本、HTTP 基本、原生 AJAX 的使用,jQuery / Axios / fetch 发送请求、跨域(JSONP/CORS)
【AJAX 笔记】AJAX 基本、HTTP 基本、原生 AJAX 的使用,jQuery / Axios / fetch 发送请求、跨域(JSONP/CORS)原创 2022-04-08 14:27:55 · 330 阅读 · 0 评论 -
【AJAX 笔记】基础内容
文章目录1、ajax 用途2、form 表单的 method、action、enctype 属性3、什么是ajax?4、ajax 发送数据流程5、ajax 属性和方法1、ajax 用途 数据传输,向服务器发送请求获取数据 简单解释 url 资源定位的交互(画图) 百度登陆2、form 表单的 method、action、enctype 属性method:GET、POST等get 比 post 短一点,是因为受地址栏输入长度的限制post 只比 get 稍微安全一点get 能实现原创 2022-04-17 09:03:28 · 584 阅读 · 0 评论 -
【JSONP 笔记】模拟百度的下拉搜索框
JSONP原理1、Web页面上用 <script> 引入 js 文件时则不受是否跨域的影响(不仅如此,我们还发现凡是拥有"src"这个属性的标签都拥有跨域的能力,比如 <script>、<img>、<iframe>)2、于是我们把数据放到服务器上,并且数据为 json 形式(因为 js 可以轻松处理 json 数据)3、因为我们无法监控通过 <script> 的 src 属性是否把数据获取完成,所以我们需要做一个处理4、实现定义好处理跨域原创 2022-04-17 09:05:53 · 178 阅读 · 0 评论 -
【同源策略】基础内容
文章目录同源策略url(资源定位器)的构成域名解析1、域名是倒着解析的2、顶级域名3、端口4、当你在浏览器里输入一个url发生了什么TCP/UDP(传输层协议)面向连接的 TCP面向非连接的 UDP 协议三次握手四次挥手应用层协议:http https等http (请求报文,响应报文) 通过报文进行沟通常见的 http 状态码请求方方法 `GET` `POST` 的区别浏览器缓存机制(http)同源策略浏览器有一个很重要的概念——同源策略(Same-Origin Policy)。所谓同源是指,域名,协原创 2022-04-17 09:13:55 · 877 阅读 · 0 评论 -
【iframe 笔记】基础内容
文章目录1、iframe2、iframe 利弊3、如何获取 iframe 内的 window4、父子页面窗口的关系5、父子窗口通信6、iframe受跨域限制如何解决父页面传给子页面值通过hash值来传子传给父 值存在window.name里,通过替换为同源文件实现访问值7、判断iframe加载完成8、iframe受跨域限制如何解决9、document.domain10、window.location.hash11、window.name1、iframe iframe 就是一个标签 dom 元素,可以原创 2022-04-17 09:09:52 · 475 阅读 · 0 评论 -
【HTML5 笔记】基础内容
1.4 两个对象元素对象(canvas 元素)和上下文对象(通过 方法获取到的CanvasRenderingContext2D 对象)元素对象相当于我们的画布,上下文对象相当于画笔,我们接下来的所有操作是基于上下文对象的1.5 线段 起笔移动到 (x,y) 坐标点 从当前点绘制直线到 (x,y) 点 描边, 设置边颜色 填充, 设置填充色 设置线段宽度 闭合当前路径 和回到起始点的区别fill 和 stroke 方法都是作用在当前的所有子路径完成一条路径后要重新开始另一条原创 2022-06-07 13:56:15 · 288 阅读 · 0 评论 -
【HTML 笔记】基础内容
文章目录01 HTML 文档结构02 基本标签div 块级标签span 行级标签h* 块级标签p 块级标签br 换行hr 块级标签a 行级标签img 行级块标签ul ol dl 块级标签!-- 注释内容 -- 添加注释03 文本格式化标签pre 块级标签strong b 行级标签em i 行级标签small big 行级标签sub sup 行级标签04 HTML 单双标记的区别05 HTML 实体转义06 HTML 块级元素和行级元素块级元素(相当于执行了 `display:block;` 操作)行级元素(原创 2022-04-17 08:42:15 · 960 阅读 · 0 评论 -
【webpack 笔记】基础内容
所谓工程化,可以简单认为是将框架的职责拓宽再拓宽,主旨是帮业务团队更好的完成需求,工程化会预测一些常碰到的问题,将之扼杀在摇篮,而这种路径是可重用的,是具有可持续性的,比如第一个优化去除冗余,是在多次去除冗余代码,思考冗余出现的原因而最终思考得出的一个避免冗余的方案说到构建工具,我往往会在前面加「自动化」三个字,因为构建工具就是用来让我们不再做机械重复的事情,解放我们的双手的要完成前端工程化,少不了工程化工具,requireJS 与 grunt 的出现,改变了业界前端代码的编写习惯,同时他们也是推动前端工程原创 2022-06-07 14:13:53 · 359 阅读 · 0 评论 -
【LESS 笔记】基础内容
Less css 是一种动态样式语言,属于 CSS 预处理语言的一种,它使用类似 CSS 的语法为 CSS 的赋予了动态的特性,如变量、继承、运算、函数等,更方便 CSS 的编写和维护实现 CSS 模块化作为一种 CSS 扩展,Less 不仅向后兼容 CSS,它还使用现有的 CSS 语法新增了额外的特性。这使得学习 Less 更轻松,一旦有任何问题,可以随时退回使用标准的 CSSLess CSS 可以在多种语言,环境中使用,包括浏览器端,桌面客户端,服务端下载包:webpack.config.js 文件里添原创 2022-06-07 14:20:12 · 323 阅读 · 0 评论 -
【JavaScript 笔记】基础内容
文章目录JavaScript 特点1、浏览器组成2、JavaScript — 解释型语言,单线程,也叫ECMAscript(ES)3、js有三个部分4、js执行队列,轮转时间片(类似吃饭)5、js引用方式(2种)6、编程形式7、错误类型ECMAScript 数据类型与数据转换1、变量命名规则2、数据类型 — 解释型语言,数据类型由值决定3、typeof() 判断数据类型,其他写法:typeof num4、Number() 转换为数字类型5、parseInt() 转换为整数类型6、parseFloat()原创 2022-04-08 15:45:08 · 1533 阅读 · 0 评论 -
【ES6-ES11 笔记】基础内容(连载中)
ECMA(European Computer Manufacturers Association)中文名称为欧洲计算机制造商协会,这个组织的目标是评估、开发和认可电信和计算机标准。1994 年后该组织改名为 Ecma 国际ECMAScript 是由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言Ecma 国际制定了许多标准,而 ECMA-262 只是其中的一个,所有标准列表查看https://www.ecma-international.org/publications-and-standa原创 2022-06-07 14:35:17 · 527 阅读 · 0 评论