web前端
关注
分享
扫一扫
李国庆❀
用最孤独的时光塑造出最好的自己，才能笑着对别人说那些云淡风轻的过去。
展开
-
搭建 vue + electron 坏境
Vue与Electron开发环境的简易搭建前期准备全局安装 vue-cliyarn global add @vue/cli# ornpm install -g @vue/cli了解Electron的渲染进程与主进程。新建一个Vue项目运行vue create app对项目进行初始配置在项目根目录下建立一个vue.config.js文件，并在其中写入：module.exports={ publicPath:'./', // productionSourceMap:f原创 2020-06-12 21:23:04 · 308 阅读 · 0 评论 -
H5新特性_调用用户设备
调用摄像头：在移动端给用户做选择是打开相册还是摄像头；在 PC 端直接打开摄像头。调用麦克风：无论在移动端还是 PC 端都直接打开麦克风。首先页面布局一个video和canvas分别用来显示视频和拍照。再添加两个按钮用来唤醒视频和拍照功能。<!DOCTYPE html><html lang="zh"><head> <meta charset=...原创 2020-03-25 10:58:39 · 179 阅读 · 0 评论 -
H5新特性_Web Workers
专用Web Worker提供了一个简单的方法使的web内容能够在后台运行脚本。一旦worker创建后，它可以向由它的创建者指定的事件监听函数传递消息，这样该worker生成的所有任务就都会接收到这个消息。worker线程能够在不干扰 UI 的情况下执行任务。考虑这样几行代码:for (let i = 0; i < 1000; i ++) { console.log(1);}cons...原创 2020-03-25 08:45:58 · 302 阅读 · 0 评论 -
H5新特性_cookies，sessionStorage 和 localStorage 数据持久化
在我们访问网站的时候，有些网站是要填写登录访问的，如果我们每次访问该网站都需要重新输入用户名密码再进行验证就显得特别麻烦。cookies，sessionStorage 和 localStorage 是三种数据持久化对象，例如：当我们访问某网站后在一定的时间内下一次打开该网站，就会自动登录用户名。都是依据这三种方法来实现的。cookie 实现：存储或修改：document.cookie = ...原创 2020-03-24 19:36:12 · 305 阅读 · 0 评论 -
封装Ajax
当我们需要使用Ajax异步请求数据时，如果使用原生Ajax，如果每次都需要调用，就会显得重复代码过多，浪费时间；或者可以引入jQuery库，但是这样做，如果不适用jQuery中的其他功能就会使资源浪费，所以一定情况下我们需要自己来封装一个Ajax，我们可以在使用时直接调用封装的函数或者引入js文件。这里附上封装好的Ajax，假设记作文件myAjax.js：function myAjax(par...原创 2020-03-20 12:18:15 · 102 阅读 · 0 评论 -
记录两款方便编写markdown的工具
TyporaPicGoTyporaTypora删除了预览窗口、模式切换程序、标记源代码的语法符号以及所有其他不必要的干扰。将它们替换为真正的实时预览功能：这里Typora为我们直接省略了#，并且显示出了实时预览的效果。PicGo在我们保存本地md文件的时候添加图片时，有时候需要使用本地链接，当我们后期删除图片时，相应的md文件也会受到影响，这款PicGo软件可以直接把本地的图片修...原创 2020-03-20 10:12:08 · 151 阅读 · 0 评论 -
php中使用PDO连接数据库
使用PDO (PDO即PHP数据对象PHP Data Object) 连接数据库。PDO提供了一个【数据访问】抽象层，这意味着不管使用哪种数据库， 都可以用相同的函数(方法)来查询和获取数据。单例模板：test.php文件<?php// PDO 连接数据库，单例模板class SingletonPDO { private static $pdo = null; p...原创 2020-03-12 16:14:48 · 442 阅读 · 0 评论 -
设计模式（单例模式）
在PHP中经常会用到单例模式，单例模式就是通过一个类创造出来的对象都是同一个，而并不是一个新的对象。特别是在DB操作中，DB连接这种对象就必须是通过单例模式来实现的。还有例如地图中我们也是使用单例模式，使用单例模式使得我们每次搜索地图后返回都不会创建一个新的对象，不仅增强了性能，还不会使地图每次都刷新，跑位。下面举例来实现：<?phpclass RichestMan { priv...原创 2020-03-12 12:45:40 · 99 阅读 · 0 评论 -
PHP连接数据库
记录一下第一次使用PHP连接数据库HTML：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...原创 2020-03-11 17:33:07 · 189 阅读 · 0 评论 -
JavaScript的垃圾回收机制
JavaScript具有自动化的垃圾回收机制，也就是说，执行环境会负责管理代码执行过程中使用的内存。而在C和C++这一类语言中，开发人员的一项基本任务就是手动跟踪内存的使用情况。在编写JavaScript程序中，开发人员不需要再关心内存的使用问题，因为所需内存的分配以及无用内存的回收完全实现了自动管理。其实这种垃圾收集机制的原理非常简单：找出那些不再继续使用的变量，然后释放其占用的内存。为此，垃圾...原创 2020-03-09 20:21:26 · 131 阅读 · 0 评论 -
事件委托
事件委托我们先考虑这样一个例子：<ul> <li>li1</li> <li>li2</li> <li>li3</li> <li>li4</li> <li>li5</li></ul>我们需要给面前的所有<li...原创 2020-03-07 21:59:58 · 1202 阅读 · 1 评论 -
那些你不知道的javascript小知识
本文会向大家介绍一些javascript中的冷门知识，看完后觉得涨姿势了别忘记点个赞哦。立即执行函数javascript中拥有立即执行函数，使用立即执行函数是有很多好处的。如果你觉得我只是给你介绍众所周知的立即执行函数的两种写法，那你还是中规中矩的往下看吧。首先，我们都知道立即执行函数有两种书写方式：// 第一种(function() { alert("hello world");}...原创 2020-03-07 20:46:59 · 220 阅读 · 0 评论 -
十大经典排序算法(10)基数排序
基数排序基数排序是一种非比较型整数排序算法，其原理是将整数按位数切割成不同的数字，然后按每个位数分别比较。由于整数也可以表达字符串（比如名字或日期）和特定格式的浮点数，所以基数排序也不是只能使用于整数。基数排序 vs 计数排序 vs 桶排序基数排序有两种方法：这三种排序算法都利用了桶的概念，但对桶的使用方法上有明显差异：基数排序：根据键值的每位数字来分配桶；计数排序：每个桶只存储单一...原创 2020-03-07 19:28:39 · 470 阅读 · 0 评论 -
十大经典排序算法(9)桶排序
桶排序桶排序是计数排序的升级版。它利用了函数的映射关系，高效与否的关键就在于这个映射函数的确定。为了使桶排序更加高效，我们需要做到这两点：在额外空间充足的情况下，尽量增大桶的数量使用的映射函数能够将输入的 N 个数据均匀的分配到 K 个桶中同时，对于桶中元素的排序，选择何种比较排序算法对于性能的影响至关重要。分析最快：当输入的数据可以均匀的分配到每一个桶中。最慢：当输入的数据被...原创 2020-03-07 19:25:38 · 297 阅读 · 0 评论 -
十大经典排序算法(8)计数排序
计数排序计数排序的核心在于将输入的数据值转化为键存储在额外开辟的数组空间中。作为一种线性时间复杂度的排序，计数排序要求输入的数据必须是有确定范围的整数。算法步骤找出待排序的数组中最大和最小的元素统计数组中每个值为i的元素出现的次数，存入数组C的第i项对所有的计数累加（从C中的第一个元素开始，每一项和前一项相加）反向填充目标数组：将每个元素i放在新数组的第C(i)项，每放一个元素就将C...原创 2020-03-07 19:20:22 · 252 阅读 · 0 评论 -
十大经典排序算法(7)堆排序
堆排序堆排序（Heapsort）是指利用堆这种数据结构所设计的一种排序算法。堆积是一个近似完全二叉树的结构，并同时满足堆积的性质：即子结点的键值或索引总是小于（或者大于）它的父节点。堆排序可以说是一种利用堆的概念来排序的选择排序。分为两种方法：大顶堆：每个节点的值都大于或等于其子节点的值，在堆排序算法中用于升序排列；小顶堆：每个节点的值都小于或等于其子节点的值，在堆排序算法中用于降序排列；...原创 2020-03-07 19:16:32 · 217 阅读 · 0 评论 -
十大经典排序算法(6)快速排序
快速排序快速排序的名字起的是简单粗暴，因为一听到这个名字你就知道它存在的意义，就是快，而且效率高！它是处理大数据最快的排序算法之一了。算法步骤从数列中挑出一个元素，称为 “基准”（pivot）;重新排序数列，所有元素比基准值小的摆放在基准前面，所有元素比基准值大的摆在基准的后面（相同的数可以到任一边）。在这个分区退出之后，该基准就处于数列的中间位置。这个称为分区（partition）操作...原创 2020-03-07 19:12:12 · 229 阅读 · 0 评论 -
十大经典排序算法(5)归并排序
归并算法归并排序（Merge sort）是建立在归并操作上的一种有效的排序算法。该算法是采用分治法（Divide and Conquer）的一个非常典型的应用。作为一种典型的分而治之思想的算法应用，归并排序的实现由两种方法：自上而下的递归（所有递归的方法都可以用迭代重写，所以就有了第 2 种方法）；自下而上的迭代；算法步骤申请空间，使其大小为两个已经排序序列之和，该空间用来存放合...原创 2020-03-07 19:06:11 · 234 阅读 · 0 评论 -
十大经典排序算法(4)希尔排序
希尔排序希尔排序，也称递减增量排序算法，是插入排序的一种更高效的改进版本。但希尔排序是非稳定排序算法。希尔排序是基于插入排序的以下两点性质而提出改进方法的：插入排序在对几乎已经排好序的数据操作时，效率高，即可以达到线性排序的效率；但插入排序一般来说是低效的，因为插入排序每次只能将数据移动一位；希尔排序的基本思想是：先将整个待排序的记录序列分割成为若干子序列分别进行直接插入排序，待整个...原创 2020-03-07 18:55:36 · 379 阅读 · 0 评论 -
十大经典排序算法(3)插入排序
插入排序插入排序的代码实现虽然没有冒泡排序和选择排序那么简单粗暴，但它的原理应该是最容易理解的。插入排序是一种最简单直观的排序算法，它的工作原理是通过构建有序序列，对于未排序数据，在已排序序列中从后向前扫描，找到相应位置并插入。插入排序和冒泡排序一样，也有一种优化算法，叫做拆半插入。算法步骤将第一待排序序列第一个元素看做一个有序序列，把第二个元素到最后一个元素当成是未排序序列。从头到...原创 2020-03-07 18:51:00 · 198 阅读 · 0 评论 -
十大经典排序算法(2)选择排序
选择排序选择排序是一种简单直观的排序算法，用到它的时候，数据规模越小越好。唯一的好处可能就是不占用额外的内存空间了吧。算法步骤首先在未排序序列中找到最小（大）元素，存放到排序序列的起始位置。再从剩余未排序元素中继续寻找最小（大）元素，然后放到已排序序列的末尾。重复第二步，直到所有元素均排序完毕。动图演示代码实现JavaScript实现：function select...原创 2020-03-07 18:45:39 · 154 阅读 · 0 评论 -
十大经典排序算法(1)冒泡排序
冒泡排序冒泡排序（Bubble Sort）也是一种简单直观的排序算法。它重复地走访过要排序的数列，一次比较两个元素，如果他们的顺序错误就把他们交换过来。走访数列的工作是重复地进行直到没有再需要交换，也就是说该数列已经排序完成。这个算法的名字由来是因为越小的元素会经由交换慢慢"浮"到数列的顶端。算法步骤比较相邻的元素。如果第一个比第二个大，就交换他们两个。对每一对相邻元素作同样的工作，从开...原创 2020-03-07 18:14:00 · 186 阅读 · 0 评论 -
JavaScript中的正则表达式
前言正则表达式，是一种独立的语法结构，许多程序设计语言都支持利用正则表达式进行字符串操作。例如：在js中我们会大量用于表单验证中，在python中，当我们使用爬虫时会用正则表达式来判断出你所要爬取的网址，如果匹配那就会爬取。正则表达式是繁琐的，但它是强大的，学会之后的应用会让你除了提高效率外，会给你带来绝对的成就感。正则表达式作用：测试字符串内的模式。例如，可以测试输入字符串，以查看...原创 2020-03-07 11:34:56 · 175 阅读 · 0 评论 -
HbuilderX进行App云打包
本文总结使用HuilderX进行简单的App云打包的过程我们使用的是Vux，它是基于WeUI和Vue(2.x)开发的移动端UI组件库，主要服务于微信页面。1. 首先全局安装vue-cli：npm install vue-cli -g2. 创建vux2项目vue init airyland/vux2 projectPath在进行选项选择时选择y，n，n，n，命令中projectPath只...原创 2020-03-06 14:23:45 · 4684 阅读 · 0 评论 -
Visual Studio Code新手入门
新手入门vscode下载vscodevscode是一款微软发布的开源的代码编辑器，使用之前，请在官网进行下载对应版本。认识vscode1.首先介绍一款插件，因为你可能是一个不习惯英文的使用者，接下来的插件介绍可以帮助你安装中文插件。点击编辑器左侧四方格插件按钮，输入chinese，install上图中的第一个插件后重新启动你的编辑器，你就会发现已经支持中文显示了。2.新建文...原创 2020-03-06 13:17:22 · 716 阅读 · 0 评论 -
Swiper配置
首先附上 Swiper 的中文网前言swiper是网页设计师必备的一项技能，它的使用频率仅次于jquery，国内大型企业包括 bat 都在使用。并且掌握好swiper也会让你在职场中游刃有余。swiper的学习特别简单，通过你简单的配置即可实现手机，电脑网页大部分滑动功能，焦点图，tab，触摸导航等。开始之前，你可以先去体验一下swiper的强大魅力，包括：基础演示，移动端应用，PC端应用...原创 2020-03-06 11:01:37 · 477 阅读 · 1 评论