- 博客(65)
- 收藏
- 关注
RSS订阅原创 解决跨域的常见方式
跨域:指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。同源是指，域名，协议，端口均相同，只要有一个不同，就是跨域。跨域会阻止什么操作？浏览器是从两个方面去做这个同源策略的，一是针对接口的请求，二是针对Dom的查询。解决跨域的方法：1. CORS服务器设置响应头：response.setHeader("Access-Control-Allow-Origin", "*")（这样可能引起CSRF攻击，一般设置成对应的域名就行，response.setHe
2020-08-08 14:46:16
272
原创 js 数组去重
在实际工作或面试中，我们经常会遇到“数组去重”问题，接下来是我总结的一些实现的数组去重的多种方法：1.将数组的每一个元素依次与其他元素做比较，发现重复元素，利用数组方法splice()删除重复元素var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5]; function norepeat(arr) { for(var i = 0; i < arr.length-1; i++){ for(
2020-08-08 11:43:10
285
原创 vue --- 组件之间的通信
组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树功能组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue.js 的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用 js 特性进行了扩展的原生 HTML 元素。所有的 Vue 组件同时也都是 Vue 的实例，所以可接受相同的选项对象 (除了一些根级特有
2020-08-01 14:53:29
267
原创 vue.js 常用指令用法
v-ifv-if指令可以完全根据表达式的值在DOM中生成或移除一个元素。如果v-if表达式赋值为false，那么对应的元素就会从DOM中移除；否则，对应元素的一个克隆将被重新插入DOM中，代码如下： <div id="app"> <p v-if="greeting">{{ msg }}</p> </div> <script> var vm = new Vue({ el
2020-08-01 13:48:56
218
原创 mysql基本条件查询语句
select语句除了可以查看数据库中的表格和视图的信息外,还可以查看 SQL Server的系统信息、复制、创建数据表。其查询功能强大，是SQL语言的灵魂语句，也是SQL中使用频率最高的语句。基本select语句：一个基本的select语句可分解成三个部分：查找什么数据（select）、从哪里查找（from）、查找的条件是什么（where）。select 语句的一般格式如下：select <目标列表达式列表>[into 新表名]from 表名或视图名[where <条件>
2020-07-26 15:14:20
644
原创 MySQL基础 — 常用命令
一、连接MySQL1、连接到本机上的MySQL:首先打开cmd窗口，输入mysql -uroot -p ，然后空格进入MySQL控制台，MySQL的提示符是： mysql>。 mysql -uroot -p //如果刚安装好MySQL，root是没有密码的2、连接到远程主机上的MySQL：假设远程主机的IP为：192.168.206.100，用户名为root,密码为12345678。mysql> mysql -h192.168.206.100 -uroot -p12345
2020-07-26 12:44:33
200
原创 mongoDB 简单的封装
在操作mongoDB的时候，为了方便操作，进行了二次封装.mongoDB基本封装// 这个模块就是封装了所有数据库操作的const MongoClient = require("mongodb").MongoClient;// 访问数据库，每次都要进行连接function _connectDB(callback){//数据库路径 const url = "mongodb://127.0.0.1:27017/school"; MongoClient.connect(url,(err
2020-07-19 15:13:25
265
原创 mongo数据库基本命令
在运行前，需要提前下载好软件，然后接下来开始操作。引入文件创建一个文件夹，把数据文件引入到文件夹当中。命令：mongod --dbpath 文件路径当出现 waiting for connections on port 27017,则引入成功，并可以使用然后重开一个命令 连接数据库。开始使用1）.创建数据库、表创建一个库/切换库,库存在则切换，不存在则创建并切换查看所有库可以看到，我们刚创建的数据库 runoob 并不在数据库的列表中， 要显示它，我们需要向 runoob 数据库
2020-07-19 12:15:11
190
原创 js 懒加载
遇到的问题有时候一个网页会包含很多的图片，例如淘宝京东这些购物网站，商品图片多只之又多，页面图片多，加载的图片就多。服务器压力就会很大。不仅影响渲染速度还会浪费带宽。比如一个1M大小的图片，并发情况下，达到1000并发，即同时有1000个人访问，就会产生1个G的带宽。为了解决以上问题，提高用户体验，就出现了懒加载方式来减轻服务器的压力，优先加载可视区域的内容，其他部分等进入了可视区域再加载，从而提高性能。...
2020-07-11 15:20:25
219
原创 js防抖与节流
在进行窗口的resize、scroll，输入框内容校验等操作时，如果事件处理函数调用的频率无限制，会加重浏览器的负担，导致用户体验非常糟糕。此时我们可以采用（防抖）和（节流）的方式来减少调用频率，同时又不影响实际效果。函数防抖函数防抖（debounce）：当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始延时。持续触发mousemove事件时，并不执行 fn 函数，当1000毫秒内没有触发 mousemove 事件时，才会延时触发
2020-07-11 10:13:54
187
原创 node 响应数据类型 Content-type
上一节中，可以看到，响应回来的内容有乱码的现象，现在解决这个问题。简单写一个服务。// 加载 http 核心模块let http = require('http');//1. 使用 http.createServer() 方法创建一个 web 服务器let server = http.createServer();//2. 监听 request 请求事件，设置请求处理函数server.on('request',function(req,res){ res.end('hello word
2020-07-03 21:51:26
378
原创 ES6 迭代器
1.什么是迭代从一个数据集合中按照一定的顺序，不断的取出数据的过程。2.迭代和遍历有什么区别迭代强调的是依次取出，不能确定取出的有多少，也不能保证把数据全部取完。遍历则需要知道数组的长度，且一次性取出。3.迭代器是什么？对迭代过程的一种封装，通常封装为对象的数据形式，不同的语言中，表现出来的迭代形式也是不一样的。4.迭代模式一种设计模式，用于统一迭代的过程，并且会规范代器的规格js迭代器满足的条件：1.迭代器有得到数据集合中下一个数据的能力2.判断是否有后续数据的能力js中迭代器 ：
2020-07-01 19:06:06
150
原创 node ---- 根据不同的路径返回不同的数据
上一节笔记中，request事件是所有请求都会触发的，并不能做到针对特定的请求响应不同的数据。如果要根据不同请求路径返回不同数据：1、对request.url进行判断// 加载 http 核心模块var http = require('http');//1. 使用 http.createServer() 方法创建一个 web 服务器var server = http.createServer();//2. 监听 request 请求事件，设置请求处理函数server.on('request'
2020-06-26 20:14:59
396
原创 node ---- 简单的http服务
可以使用Node 可以轻松的搭建一个 web 服务器，在node 中提供了一个核心模块：httphttp 这个模块的职责就是帮你创建编写服务器的。1.加载 http 核心模块 var http = require('http');2.使用 http.createServer() 方法创建一个 web 服务器，返回一个server 实例 var server = http.createServer();3.发送请求，接受请求注册 request 请求事件，当客户端请求过来，就会自动触发服务器
2020-06-26 14:07:44
198
原创 node读取文件
在Node中，采用 ECMASctipt 进行编码，没有 BOM 和 DOM。 和浏览器中的JavaScript不一样var foo = 'bar';console.log(foo);console.log(window);console.log(document)浏览器中的JavaScript 没有文件操作的能力，但是 Node 中的 JavaScript 具有文件操作的能力。1. 使用 require 方法加载 fs 核心模块var fs = require('fs);fs 是
2020-06-21 15:11:48
231
原创 typescript -----基本类型(一)
TypeScript 支持 JavaScript相同的数据类型，还提供了枚举等类型。为了让程序有价值，我们需要能够处理最简单的数据单元：数字，字符串，结构体，布尔值等。 TypeScript支持与JavaScript几乎相同的数据类型。1.字符串：和JavaScript 一样，可以使用双引号(") 或 单引号 （'）表示字符串ts:// 字符串let dogName: string = '旺财'let dogSex: string = "公"let dogAge: number = 5le
2020-06-14 11:03:57
259
原创 ajax ----get请求
发送 Ajax 请求的五个步骤1.创建异步对象。即 XMLHttpRequest 对象。2.注册事件。 onreadystatechange事件，状态改变时就会调用。如果要在数据完整请求回来的时候才调用，我们需要手动写一些判断的逻辑。3.设置请求的参数。包括：请求的方法、请求的url。4.发送请求。5.获取返回的数据。使用ajax GET方式发送请求：<!DOCTYPE html><html lang="en"><head> <meta
2020-06-12 13:03:24
216
原创 PHP基础语法 ---- 变量和字符串的拼接
声明（创建）变量声明 PHP 变量必须使用一个美元符号“$”后面跟变量名来表示，然后再使用“=”给这个变量赋值。 <?php $a = 1; $b = 2; $c = 3; echo $a,$b,$c; ?>在 jsscript 中 用var 声明 <script> var a = 10; console.log(a); </script>变量的命名规则变量名并不是可以随意定义的，一个有效
2020-06-06 16:39:29
3239
原创 PHP语法的基本结构 --- Hollworld的实现
php简介PHP（Hypertext Preprocessor,超文本预处理器）。嵌入HTML文件中的服务器脚本程序.PHP代码标记：<?php …. ?>PHP文件的扩展名：.phpPHP文件的执行：必须从域名开始访问PHP每条语句必须以英文（;）结束echo 的作用：就是向页面当中输入字符串1. 所有的PHP代码都要写道 <?php...?>里面先创建一个 .php 文件 <?php echo "hello World PHP"; ?>
2020-06-06 14:38:41
317
原创 get和post 两种基本请求方式的区别
最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。GET和POST是什么？HTTP协议中的两种发送请求的方法。HTTP是什么？HTTP是基于TCP/IP的关于数据如何在万维网中如何通信的协议。HTTP的底层是TCP/IP。所以GET和POST的底层也是TCP/IP，也就是说，GET/POST都是TCP链接。GET和POST能做的事情是一样一样的。你要给GET加上request body，给POST带上url参数，技术上是完全行的通的。接下来看看两种请求方式的区
2020-05-30 20:37:59
324
原创 Http请求方式中8种请求方法（简单介绍）
简介HTTP是超文本传输协议，其定义了客户端与服务器端之间文本传输的规范。HTTP默认使用80端口，这个端口指的是服务端的端口，而客户端使用的端口是动态分配的。当我们没有指定端口访问时，浏览器会默认帮我们添加80端口。我们也可以自己指定访问端口如：http://www.ip138.com:80。 需要注意的是，现在大多数访问都使用了HTTPS协议，而HTTPS的默认端口为443，如果使用80端口访问HTTPS协议的服务器可能会被拒绝。HTTP请求的方法：HTTP/1.1协议中共定义了八种方法（有时也
2020-05-29 19:02:30
642
原创 jquery ---- 获取元素的大小
width([纯数字/带单位的字符串]) 返回宽度/设置宽度 (返回值是数字)代码：<style> .box{ width: 100px; height: 100px; background-color: aquamarine; }</style><body> <div class="box"></div> <script> //获取
2020-05-22 21:43:48
232
原创 jquery效果 ----- 显示隐藏元素
jQuery的 hide() 和 show()通过 jQuery，可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素：$(".btn").click(function(){ $(".box").show(); }) $(".btn").click(function(){ $(".box").hide(); }) 语法：$(selector).hide(speed,callback);$(selector).show(speed,callback
2020-05-22 20:52:36
311
原创 jquery --- 在元素之前/之后插入某个元素
以下面代码为例： <div class="warpper"> <span>天气很凉快</span> <p>我是1</p> <span class="box">我是box</span> <p>我在2下面</p> <span>我是3</span> </div> <script>
2020-05-17 14:58:17
8112
原创 jquery ---- 获取兄弟元素的方法
以下列代码为例：<body> <div class="warpper"> <span>天气很凉快</span> <p>我是1</p> <span class="box">我是2</span> <p>我在2下面</p> <span>我是3</span> <p
2020-05-17 14:01:42
480
原创 bootstrap ----- 基本的按钮组件
一、 btn类基础按钮类，将a标签、 button标签、button类型的input标签转换成bootstrap下基础按钮样式。 <div style="margin-bottom:15px"><a href="#">查看评论</a></div> <div style="margin-bottom:15px"> <button type="submit">结账</button></div>
2020-05-10 19:41:09
309
原创 bootstrap ---- 边框效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1">.
2020-05-10 19:11:43
809
原创 jQuery ------ 比较常见的选择器
jQuery选择器继承了CSS与Path语言的部分语法，允许通过标签名、属性名或内容对DOM元素进行快速、准确的选择，而不必担心浏览器的兼容性，通过jQuery选择器对页面元素的精准定位，才能完成元素属性和行为的处理。比较常见的选择器 比如：1).$("#id名"):代替document.getElementById(“id”);当点击一个按钮时，改变样式：<!DOCTYPE htm...
2020-05-01 21:33:10
194
原创 jQuery ----- 页面的加载事件
在 DOM 中，页面的加载事件可以写成： <script> window.onload = function(){ console.log('哈哈，今天天气真好1！'); } window.onload = function(){ console.log('哈哈，今天天气真好2！'); } ...
2020-05-01 16:49:19
315
原创 bootstrap ----- 列偏移
使用 .col-md-offset- 类可以将列向右侧进行偏移。*<style> .one{ border: 1px solid black; } .one div{ background-color: blueviolet; } .one div:nth-of-type(2){ background-color...
2020-05-01 12:58:12
588
原创 BootStrap----栅格系统（布局）
1、栅格系统（布局）Bootstrap内置了一套响应式、移动设备优先的流式栅格系统，随着屏幕设备或视口（viewport）尺寸的增加，系统会自动分为最多12列。栅格系统的实现原理非常简单，仅仅是通过定义容器大小，平分12份(也有平分成24份或32份，但12份是最常见的)，再调整内外边距，最后结合媒体查询，就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。...
2020-05-01 11:47:17
673
原创 Css3 ---- animation 动画
实现让一个元素绕四周做运动代码： 首先画出这个元素，以图片为例。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scal...
2020-04-25 19:17:30
145
原创 Css3 ---- transform平移
transform的用法：transform：translate（x轴平移，y轴平移）; 也可以单独设置：transform：translateX（）; transform：translateY（）。如果只设置transform：translate（值），那么只会在X轴进行平移。值可以取负数。也可以设置为 translateZ(); 但是需要 配合旋转，效果才比较明显。代码： <!...
2020-04-25 16:01:07
2547
原创 Css3 ---- 文字阴影效果
文字阴影 text-shadowtext-shadow属性值的顺序：text-shadow: 水平阴影位置，垂直阴影位置，模糊半径，阴影颜色;例如： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewpor...
2020-04-18 12:55:38
252
原创 css3----基本选择器
基本选择器以下的基本选择器都在 index.html 的基础上添加样式实现： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia...
2020-04-18 11:53:27
145
原创 百度地图之控件的使用
百度地图API控件介绍1.Control控件的抽象基类：所有控件均继承此类的方法、属性。通过此类您可实现自定义控件。2.NavigationControl地图平移缩放控件：PC端默认位于地图左上方，它包含控制地图的平移和缩放的功能。移动端提供缩放控件，默认位于地图右下方。3.OverviewMapControl缩略地图控件：默认位于地图右下方，是一个可折叠的缩略地图。4.ScaleC...
2020-04-11 14:09:41
815
原创 canvas---- 绘制矩形和圆形
html5为我们提供了非常有特色的标签，canvas标签为我们可以实现在网页中画图提供了便利，接下来我们列举他的常用操作。新建一个html5的文档，建立一个canvas画布，设置长和宽，这里需要注意的是，canvas标签可以在标签内设置width,height,也能通过css来设置，但是通过css来设置的标签，当绘制图形的时候会变形，所以建议直接在标签内设置。 <!DOCTYPE htm...
2020-04-11 11:14:07
389
原创 ES6 — 箭头函数
一 为什么要有箭头函数在日常开发中，可能会需要写类似下面的代码:其实上例的输出结果是我是undefined，我今年undefined岁！。为什么会输出这种结果呢？这是因为setTimeout执行的时候，是在全局作用域下的，所有this指向的是全局window,而window上没有names和age，所以当然输出的是undefinedl了。怎么解决？通常的写法是缓存this,然后在se...
2020-03-25 11:30:50
125
原创 ES6 ---- class类
传统的javascript中只有对象，没有类。它是基于原型的面向对象语言。原型对象特点就是将自身的属性共享给新的对象。如果要生成一个对象实例，就需要先定义一个构造函数，然后通过new操作符来完成。构造函数示例：构造函数生成实例的执行过程：1.当使用了构造函数，并且 new 构造函数(), 后台会隐式执行new Object()创建对象;2.将构造函数的作用域给新对象，（即new Obj...
2020-03-24 21:08:12
164
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人