- 博客(53)
- 收藏
- 关注
RSS订阅原创 Vue框架
Vue框架一、v-model双向绑定// 引入 vue.js 库<script src="./vue.min.js"></script><div id="node"> <h1> 欢迎{{ secondName + '' + firstName}}来到Vue学习阶段！ </h1> <!-- v-model.trim 去掉输入内容两边的空格 --> <!-- v-model.lazy 懒监听--&g
2021-09-14 01:39:32
279
原创 JavaScript学习Day33笔记
模块化编程一、什么是模块化将一个复杂的程序依据一定的规则（规范）封装成几个块（文件），并进行组合在一起。块的内部数据与实现都是私有的，只是向外部暴露一些**接口（方法）**与外部其它模块通信。二、模块化的好处避免命名冲突（减少命名空间污染）。更好的分离，按需加载。更高的复用性。高可维护性。三、CommonJS规范// 暴露模块module.exprots = valuemodule.exports.xxx = value// 引入第三方模块let example = re
2021-07-17 11:45:20
231
1
原创 JavaScript学习Day32笔记
Day32笔记一、Promise异步编程Promise是异步编程的一种解决方案。从语法上讲，Promise是一个内置对象（构造函数），自身上有 resolve 、 reject 等方法，原型上有 then 、 catch 等方法。new Promise(function(resolve,reject){})Promise对象提供了简洁的API，使得控制异步操作更加容易，避免了回调地域的问题。二、Promise的三种状态pending => 正在请求rejecte
2021-07-02 20:16:46
300
3
原创 JavaScript学习Day31笔记
Day31笔记一、GULP自动化打包构建工具搭建web服务器。文件保存时自动重载浏览器。使用预处理器SASS。优化资源，比如压缩CSS、JavaScript、HTML文件等。打包项目：通过配置一系列的task（任务），定义task处理的事物，然后定义执行顺序，来让gulp执行task，这就是构建前端项目的流程。二、创建项目创建项目目录npm初始化// 在 mygulp 文件夹下npm初始化。$ cd mygulp$ npm init -y安装gulp工具// 全局安装
2021-07-01 21:58:40
213
原创 JavaScript学习Day30笔记
Day30笔记一、分布式版本管理器GIT管理项目文件的工具，可以保留项目所有的版本。当某个项目文件被 GIT 管理后，我们可以进行各种操作来保证我们写过的内容不会丢失。二、GIT版本库当一个文件夹被 git 管理后，git 会对当前文件夹进行分区。[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-NM20ns5E-1625056608419)(C:\Users\两两\AppData\Roaming\Typora\typora-user-images\image-2
2021-06-30 20:37:24
242
2
原创 JavaScript学习Day29笔记
Day29笔记一、异步与同步JavaScript是单线程语言，就好比只有一条流水线。同步所有代码按顺序执行，后面的代码需要等待前面的代码执行完毕。异步异步是一种代码的执行方式，无需等待前面的代码执行完毕，异步程序在触发（代码执行顺序触发、事件触发、计时器触发等）后单独执行，程序执行的结果会反应给回调函数，通过回调函数就可以知道异步程序是否成功执行。二、NPM包管理器NPM：Node Package(包) Manager(管理器)。Node.js（一个脱离浏览器可以单独运行的JavaSc
2021-06-29 20:27:28
388
5
原创 JavaScript学习Day28笔记
Day28笔记一、数据库数据库就是存储数据的仓库，其本质是一个文件系统，数据按照特定的格式将数据存储起来，用户可以对数据库中的数据进行增加，修改，删除及查询操作。二、数据库管理系统指一种操作和管理数据库的大型软件，用于建立、使用和维护数据库，对数据库进行统一管理和控制，以保证数据库的安全性和完整性。用户通过数据库管理系统可视化访问数据库中表内的数据。三、数据库表数据库中以表为单位存储数据。数据库表与JavaScript的类相似，对应的关系可以看成为：类 => 表类中属性 =&g
2021-06-28 22:58:52
124
2
原创 JavaScript学习Day27笔记
Day27笔记一、什么是设计模式什么是设计模式呢？ 就是指对于类似的问题，我们可以用大致相同的思想、方法去解决之，而这种通用的思想、方法就是设计模式。换言之，就是用“套路”做事情。二、设计模式的特点是已经经过验证，可以复用的解决方案（解决某一类问题的方法）。是从生产和生活经验中，提炼出来的核心知识体系。三、设计模式的分类1.创建型设计模式创建型设计模式专注于处理对象创建机制，适合给定情况的方式来创建对象。Constructor（构造器）Factory（工厂）Abstract（抽象
2021-06-27 03:19:20
157
原创 JavaScript学习Day26笔记
Day26笔记一、jQuery操作Ajax$.ajax()方法$.ajax({ type:'GET'/'POST', url:'URL', dataType:'json', contentType:'application/x-www-form-urlencoded'， timeout:time, cache:boolean, data{ name:'jack', age:23 }, success:function(da
2021-06-25 01:11:08
127
4
原创 JavaScript学习Day25笔记
Day25笔记一、jQuery对象和DOM对象转换jQuery对象 => DOM对象const domEle = $(selector)[i]const domEle = $(selector).get[i]DOM对象 => jQuery对象const domEle = document.querSelector(selector)$(domEle)二、jQuery操作元素尺寸/位置元素尺寸// 获取元素 content 尺寸$(selector).width(
2021-06-23 19:24:48
133
原创 JavaScript学习Day24笔记
Day24笔记一、jQuery操作内容$(selector).html() => innerHTML$(selector).text() => innerText$(selector).val() => value二、jQuery操作属性获取元素属性$(selector).attr('属性名')$(selector).prop('属性名')设置元素属性$(selector).attr('属性名','属性值')$(selector).prop('属性名'
2021-06-22 19:54:31
133
原创 JavaScript学习Day23笔记
Day23笔记一、普通构造函数继承继承是一种关系，类与类之间的关系。继承实现了数据共享。节省内存空间。// 声明一个父类function Father(形参1,形参2) { this.属性1 = 形参1 this.属性2 = 形参2 this.方法1 = function(){ }}Father.prototype.方法2 = function() { }// 声明一个子类function Son(形参1,形参2,形参3) { // 构造函数继承不能继
2021-06-21 20:19:38
104
原创 JavaScript学习Day22笔记
Day22笔记一、什么是跨域 当浏览器从一个网页的URL地址去请求另一个网页URL的地址时，如果协议、域名、端口三者之间任意一个与当前页面的URL不同，都会引起跨域。注：localhost和本机的IP地址虽然都指向本机，但也属于跨域。二、引起跨域的原因浏览器安全限制同源策略XHR(XMLHttpRequest)请求三、同源策略 同源策略时由NetScape网景公司提出第一个著名的安全策略，现在所有支持JavaScript的浏览器都会使用这个策略。限制了从一个源加载的文档或脚本如
2021-06-20 17:53:15
186
1
原创 JavaScript学习Day21笔记
Day21笔记一、HTTP超文本传输协议超文本传输协议是一种通信协议，它允许将超文本标记语言（HTML）文档从WEB服务器传送到客户端的浏览器。HTTP是一个基于请求与响应模式的、无状态的、应用层的协议。HTTP使用的传输层协议为TCP协议，而网络层使用的是IP协议（当然还使用了很多其他协议），所以说HTTP是基于TCP/IP协议簇来传递数据。二、HTTP协议的五大特点支持客户/服务器模式客户/服务器模式工作的方式是由客户端向服务器发出请求，服务器端响应请求，并进行相应服务。简单
2021-06-18 23:27:02
122
原创 JavaScript学习Day20笔记
Day20笔记一、class类// 类名规则首字母大写class 类名{ // constructor构造器，固定写法 constructor(){ // 构造器中定义固定属性 this.属性1 = 属性值 } // 方法直接书写 方法名(){ // 方法函数中定义属性，也会储存在constructor中 this.属性2 = 属性值 }}// 必须使用new关键字调用class类。/
2021-06-17 20:17:21
273
1
原创 JavaScript学习Day19笔记
Day19笔记一、getComputedStyle获取CSS属性// hwindow.getComputedStyle(Ele,null).css属性名二、SCROLL滚动事件// 获取滚动条距离顶部的距离document.documentElement.scrollTopwindow.pageYOffset// 获取滚动条距离左边的距离document.documentElement.scrollLeftwindow.pageXOffset三、获取元素尺寸offsetWidt
2021-06-15 20:23:50
223
2
原创 JavaScript学习day18笔记
Day18笔记一、什么是构造函数 在JavaScript中，当一个函数创建好以后，我们并不知道它是不是构造函数，只有当一个函数用new关键字来调用的时候，我们才能称它时一个构造函数。二、构造函数的语法// 首字母需大写。let Fn() { this.属性 = 属性值, this.say = function() { }}// 必须使用new关键字调用构造函数。// 实例化构造函数，得到一个实例化对象p1。let p1 = new Fn()// 此时p1就可以调用构造函数中的属性
2021-06-09 23:03:38
139
2
原创 JavaScript学习Day17笔记
Day17笔记一、正则表达式定义：正则表达式全称“Regular Expression”，在代码中常简写为regex、regexp或RE。正则表达式就是用某种模式去匹配（match）、查找（search）、替换（replace）、判单一类字符串的公式。语法：// 显式定义。var reg = new RegExp("正则表达式")// 隐式定义。var reg = /正则表达式/// 举例,这两种写法效果一样。var reg = new RegExp("\d+")=>
2021-06-08 19:46:55
110
原创 JavaScript学习day16笔记
Day16笔记一、解构对象// 声明一个obj对象。let obj = { name : 'jack', age : 23,}// 解构obj对象。let{name,age} = obj=>let name = 'jack'let age = 23// 字面量简化对象。let obj{ name:name, // 前一个name是属性名，后一个name是变量。 age:age // 前一个age是属性名，后一个age是变量。}// 声明一个
2021-06-07 19:32:08
157
原创 JavaScript学习Day15笔记
Day15笔记一、自调用函数语法：// 直接获取返回值。(function() {} ())// 先计算前面括号的值，再执行返回值，返回的是函数。(function() {}) ()二、this关键字事件处理函数中this => 事件源对象的方法函数中this => 对象本身obj定时器匿名函数中this => window全局函数中this => window自调用函数中this => window箭头函数中没有this
2021-06-05 10:27:52
153
原创 JavaScript学习Day14笔记
Day14笔记一、页面事件事件说明onload加载完成后执行ononresize尺寸改变时执行onscroll滚动条滚动时执行onerror加载失败时执行二、EVENT事件对象只要触发事件，就会生成event对象。node.Ele.事件 = function(event){ // 打印event事件对象的结构。 console.dir(event)}currentTarget属性和target属性// currentTarget和
2021-06-03 19:51:51
153
1
原创 JavaScript学习Day13笔记
Day笔记一、JavaScript事件事件三要素事件源 获取事件源：getElement、querySelector绑定事件（事件类型） 1、鼠标事件 2、键盘事件 3、表单事件 4、编辑事件 5、页面相关事件事件处理函数（匿名函数）事件调用方式属性事件<标签 事件=“事件处理函数调用语句” />- 事件绑定 ```jsnodeEle.事件名 = function(){}// 当同一个节点绑定同一种事件时，前
2021-06-03 19:49:19
164
原创 JavaScript学习Day12笔记
Day12笔记一、DOM控制节点DOM新增节点// 创建元素节点。createElement('元素节点名')// 创建文本节点。createTextNode('文本节点内容')DOM移除节点// 移除父元素节点中的某个子节点。parentNode.removeChild(removeNode)DOM插入节点// 给父元素节点追加子节点。parentNode.appendChild(newNode)// 在父元素节点中某个子节点前面插入一个新的子节点。parentNode
2021-06-02 09:01:25
94
原创 JavaScript学习Day11笔记
Day11笔记一、什么是DOMDOM是Document Object Model（文档对象模型）的缩写，是W3C（万维网联盟）的标准。它允许程序和脚本动态地方位和更新文档的内容、结构和样式。在前端开发时，我们往往需要在页面某个地方添加一个元素或者删除元素，这种添加元素、删除元素的操作就是通过DOM来实现的。二、DOM节点类型整个文档时一个文档节点 => docunment节点。根节点：<html>。每个HTML元素是元素节点。HTML元素内的文本是文本节点注释是注
2021-06-01 20:33:45
92
原创 JavaScript学习Day10笔记
Day10笔记一、延时定时器// 延时调用。// 当code是函数调用语句时，不用加（），直接写函数名。// 一般情况下，code都是使用匿名函数。// time是延迟时间，单位毫秒。setTimeout(code,time)返回值 返回一个Number类型的数据，作为定时器的唯一标识。var 定时器名 = setTimeout(code,time)清除延时定时器clearTimeout(定时器名)二、循环定时器// 重复调用。// 当code是函数调用语句时，不用加（
2021-06-01 20:33:14
109
原创 JavaScript学习Day09笔记
Day09笔记一、Date内置对象// 获取当前时间。var date = new Date();// 格式1：var date = new Date('年-月-日 时:分:秒');// 格式2：var date = new Date(年,月,日,时,分,秒,);// 格式3：var date = new Date(毫秒);格式化// 获取年。date.getFullYear();// 获取月 计算机会获取floor的值，所以需要+1。date.getMonth()+1;
2021-06-01 20:32:14
118
原创 JavaScript学习Day08笔记
Day08笔记一、new语句new语句，也可以用来创造简单数据类型。var str = new String('内容');var num = new Number(数值);var boo = new Boolean(true/false);二、包装类型定义：在使用时会被动自动转换为复杂数据类型（对象类型），使用完之后转变为基本数据类型。触发条件：.语句。三、字符串string常用功能.charAt(i) i => 索引号。 作用：找到该索引号位置的字
2021-06-01 20:31:39
111
原创 JavaScript学习Day07笔记
Day07笔记一、遍历因为数组的索引就可以获取数组中的内容。数组的索引又是按照 0 ～ n 顺序排列。for in 循环的遍历是按照对象中有多少成员来决定了。有多少成员，就会执行多少次我们把这个行为叫做 遍历。二、indexof遍历数组根据数据找下标（索引号）var 新建变量名 = 数组名.indexOf(数据)；// 找到第一个相同的数据，并返还索引号 => number三、forEach遍历数组数组名.forEach(function(item(每一项数据),inde
2021-06-01 20:31:09
102
原创 JavaScript学习Day06笔记
Day06笔记一、数组array什么是数组数组是复杂数据类型array。函数是装代码的盒子，数组就是装数据（基本数据类型）的盒子。语法：// 字面量方式创建数组。var 数组名 = [数据1，数据2]；// new语句，构造函数方式创建数组。var 数组名 = new Array(数据个数)；使用数组中数据的方法：通过数组的下标（索引号）访问数组中的数据并赋值。数组名[下标（索引号）] = 数据值；注意：数组为动态数组。当用下标（索引号）访问超过数组数据个数
2021-06-01 20:30:35
808
原创 JavaScript学习Day05笔记
Day05笔记一、什么是递归一个函数内部，调用了自己，循环往复。将自己的函数调用语句写在自己的函数体中。语法：// 声明一个函数。function 函数名(行参){// 判断条件是否成立。 if(条件判断){// 条件成立时返回值。 return// 条件不成立时 }else{// 条件不成立时返回值，自己调用自己，称为递归调用。 return 函数名() } }// 程序从这里开始，函数调用语句。函数名(实参);
2021-06-01 20:30:03
75
原创 JavaScript学习Day04笔记
Day04笔记一、函数1.函数的定义：只是将一段代码保存在变量里面, 但是不会执行。可以看成一个装代码的盒子。2.为什么要使用函数：在开发过程中, 一段代码在多个地方执行, 而且不连续执行 那我们怎么办?? 用函数。3.函数的好处：解决代码冗余的问题, 便于维护。使用方便。4.和循环的区别=> 作用不一样：循环 : 只能在同一个地方,重复执行同一段代码。函数 : 可以在多个地方, 重复执行同一段代码。=> 本质不一样：循环 : 只是一种语法, 代表代码重复执行
2021-06-01 20:28:05
164
原创 JavaScript学习Day03笔记
Day03笔记一、结构化程序设计结构化程序设计方法主要由以下三种逻辑结构组成：1)顺序结构：顺序结构是一种线性、有序的结构，它依次执行各语句模块。2)分支（选择）结构：选择结构是根据条件成立与否选择程序执行的通路。 => if语句 => if else语句 => if else if语句 => switch语句3)循环结构：循环结构是重复执行一个或几个模块，直到满足某一条件为止。 => while循环 => do-while循环 =&
2021-06-01 20:27:31
103
原创 JavaScript学习Day02笔记
Day02笔记一、数据类型转换1、Number语法：var a = "100";// Number函数。a = Number(a);// 当数值型字符串碰到number,中间用算术运算符连接。a = '123';a +-*/ number;// parseInt函数；a = parseInt(a);/* 1、一个字符一个字符去解析，123abc => 123; 2、取整数。*///parseFloat函数：a = parseFloat(a);/* 1、一个字符
2021-06-01 20:26:22
93
原创 JavaScript学习Day01笔记
Day01笔记一、js是什么javascript是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。二、js的历史1994年网景公司发布了Navigator（导航者）浏览器，当时浏览器只能浏览页面，无法进行互动。1995年网景公司雇佣34岁的程序员布兰登·爱奇，用了10天的时间设计出JavaScript语言（第一版）。(1)借鉴C语言的基本语法;(2)借鉴Java语言的数据类型和内存管理;(3)借鉴Scheme语言，将函数提升到"第一等公民"(first class)的地位;(4)借
2021-05-31 20:24:53
220
原创 HTML+CSS学习Day19笔记
网站结构和网站优化### 一、网站结构1、站点：其实就是用来归纳网站素材的地方html文件夹images(img)文件夹css文件夹js文件夹index.html 主页面注意点：这种结构在目前的开发环境中已经无法满足需求，所以这种结构会进行变化2、目前开发环境网站结构src目录 网站源代码目录html（page、static）文件夹 静态页面css 文件夹js 文件夹fonts 文件夹video 文件夹libs 文件夹（引入外部的一些资源 j
2021-05-31 16:54:58
120
原创 HTML+CSS学习Day18笔记
Day18笔记一、3D属性transform变形translate3d(值1, 值2, 值3) 3D新增的属性1、值1表示X轴位移，单位px2、值2表示Y轴位移，单位px3、值3表示Z轴位移，单位px rotate3d(值1, 值2, 值3, 值4) 3D新增的属性1、前三个值分别表示X、Y、Z轴，值只有1和0。0表示不旋转、1表示旋转2、值4表示的是度数 scale3d(值1, 值2, 值3) 3D新增的属性1、值1表示X轴缩放2、值2表示Y轴缩放3、值3表示Z轴缩放
2021-05-31 16:54:22
135
原创 HTML+CSS学习Day17笔记
Day17笔记一、图片优化的四种方法1、css sprite/精灵图/雪碧图/图片整合技术，将小图整合到一张图上，通过定位显示。2、base64格式将图片变成代码的形式，百度搜索“图片base64”，选择《base64图片在线转换工具-站长工具》网站，上传图片，复制转换的代码。<img src="base64代码"/>3、svg格式svg意为可缩放矢量图标，svg使用XML格式定义图像放大或缩小不会变形，这是H5新增的形式XML为自定义标记语言，xhml不能自定义。svg为
2021-05-31 16:53:48
128
原创 HTML+CSS学习Day16笔记
Day16笔记一、rem字符单位rem （font size of the root element）相对于根元素字体大小的单位，需要一个参照 html{font-size:100px;}1rem = 100px（此处设为100px为了方便计算）作用：实现屏幕适配，rem这个值不是固定的，可以根据根元素字体大小动态改变注意点：font-size大小不能为10px，浏览器最小字体是12px，默认显示大小为24px。为什么web app要使用rem？实现强大的屏幕适配布局(淘宝,腾讯,网易等网站
2021-05-31 16:52:43
122
原创 HTML+CSS学习Day15笔记
Day15笔记一、根选择器root和html是一样的:root{ background-color:orang;}二、否定选择器否定选择器（不自信选择器）：给它设置的样式，除了它自己以外没有作用，其他都有作用语法：标记:not([属性="属性值"])作用：会改变除了具有此属性值的此种标记input:not([type="tel"]){ borde:1px solid red;}如果想对某个结构元素使用样式，但是又想排除这个结构下的某些子结构时，否定伪类选择器就非常有用，它可以过
2021-05-31 16:51:42
383
原创 HTML+CSS学习Day14笔记
Day14笔记一、H5新增多媒体标记<video width="800" height=""> <!--source标记 表示资源 src属性表示路径 作用：可以把相同视频的不同格式引入到这个标记里面,mp4/ogg/webm表示视频文件格式--><source src="myvideo.mp4" type="video/mp4"></source><source src="myvideo.ogv" type="video/ogg"&g
2021-05-31 16:51:03
114
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人