canvas的常用功能(电脑版)canvas的常用功能(电脑版)
前言:
canvas可以单独算为前端的一大知识模块, 今天就研究一下.
先做下前文铺垫:
①创建canvas
<canvas id="myCanvas" width="200" height="100" style="border:1px sol...[2019/10/11]
使用Vue-cli3.0创建的项目，如何发布npm包使用Vue-cli3.0创建的项目，如何发布npm包
使用Vue-cli3.0创建的项目，如何发布npm包
在使用vue进行项目开发时，如果我们想要发布一个包，有时候会有点迷糊，不知道应该怎么修改脚手架的默认设置。这里记录一下一些常见的操作。
创建index.js进行模块的导出
将我们需要导出的组件在index.js文件中进行统一导出...[2019/10/11]
Turn.js 实现翻书效果(自适应单双页)
来源：https: www.cnblogs.com/hellman/p/10683492.html在上面的来源基础上增加页码显示，自适应单双页PC端效果：
移动端展示：
源码下载地址：http: www.luanxin.top/index.php/archive 30...[2019/10/11]
关于CSS的书写规范和顺序关于CSS的书写规范和顺序
关于CSS的书写规范和顺序，是大部分前端er都必须要攻克的一门关卡，如果没有按照良好的CSS书写规范来写CSS代码，会影响代码的阅读体验。这里总结了一个CSS书写规范、CSS书写顺序供大家参考，这些是参考了国外一些文章以及我的个人经验总结出来，我想对写CSS的前端用户来说是值得学习的。
...[2019/10/10]
你应该知道的简单易用的CSS技巧
作为前端，在工作中难免会遇到关于排版的问题，以下是我整理的一些关于CSS的技巧，希望对你能有帮助。
1、每个单词的首字母大写
一般我们会用JS实现，其实CSS就可以实现。
JS代码：
var str = 'hello world';
str....[2019/10/10]
抖音抖一抖-SVG和CSS视觉故障艺术小赏
故障艺术，英文名称叫glitch，在很多赛博朋克作品中经常看到，其实就是故意表现一种显示设备的小故障效果，抖音的图标其实就是这种的效果，我们看下这个图标
这个图标中的红色和蓝色的偏移其实就是一种故障艺术，看到这个，我就能想到早年我家还没有有线电视时，摇天线对电视信号的场景，信号...[2019/10/10]
uni-app聊天室|vue+uniapp仿微信聊天实例|uniapp仿微信App界面
一、介绍
运用UniApp+Vue+Vuex+swiper+uniPop等技术开发的仿微信原生App聊天室|仿微信聊天界面实例项目uniapp-chatroom，实现了发送图文消息、表情(gif图)，图片预览、地图位置、长按菜单、红包/钱包、仿微信朋友圈等功能。
二、测试效果
H...[2019/10/10]
一、springboot入门
[toc]
1.1 sb（springboot）简介
spring作为一个轻量级的容器（docker），在JavaEE开发中得到了广泛的应用，当下流行的SSM、SSH框架体系都融入了spring，但是Spring的配置繁琐臃肿，特别是整合第三方框架的时候，都需要开发者自己编写各种配置文...[2019/10/9]
使用webgl(three.js)搭建3D智慧园区、3D大屏，3D楼宇，智慧灯杆三维展示，3D灯杆，web版3D,bim管理系统——第六课
前言：
今年是建国70周年，爱国热情异常的高涨，为自己身在如此安全、蓬勃发展的国家深感自豪。
我们公司楼下为庆祝国庆，拉了这样的标语，每个人做好一件事，就组成了我们强大的祖国。
看到这句话，深有感触，是的，强大的背后离不开我们每个人的奋力拼搏，作为基础研发的我们，我们也认认真...[2019/10/8]
html5的基本结构
1.基本结构
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
&...[2019/10/8]
2.html5新布局元素
1.html5的优点：
①对人友好，更加语义化，更直观，增加了代码的可读性。
②对计算机友好，浏览器更容易解析，搜索引擎更容易抓取文档内容。
③代码更加的简洁。
2.新增的布局标签：
Article：定义一个独立内容区块，一篇文章，一个视频等；
Section：定...[2019/10/8]
4.音频与视频
1.video：支持的三种格式：Ogg，MPEG4，WebM。
Src属性：要播放视频的地址。
Width属性：宽度。
Height属性：高度。
Autoplay属性：自动播放。
Loop属性：循环播放。
Controls属性：向用户展示控件，如播放按钮。
P...[2019/10/8]
用CodePush在React Native App中做热更新
最近在学React Native，学到了CodePush热更新。
老师讲了两种实现的方法，现将其记录一下。
相比较原生开发，使用React Native开发App不仅能节约开发成本，还能做原生开发不能实现的热更新功能。
使用原生技术开发App时，每次代码做了改动后，都需要提交...[2019/10/8]
vue实现简易计算器vue实现简易计算器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>简易计算器</title>
<s...[2019/9/29]
html5视频媒体标签video的使用方法及完整参数说明详解
video是HTML5的一个视频媒体标签，其作用是在网页中嵌入指定的视频，video标签的代码结构及参数如下。
HTML代码结构：
<video
controls
autoplay
loop
preload="auto&quo...[2019/9/29]
HTML5常用的语义化标签
快速查询
article | aside | nav | section | header | footer
架构预览
nav 定义导航链接的部分
在页脚显示一个站点的导航链接,如首页、服务信息页面、版权信息页面等
<nav>
...[2019/9/27]
图片并列
<!DOCTYPE html>
<html> <head> <meta charset="UTF-8"> <title>图片并排排列</title> <style> .xd...[2019/9/27]
前端校招知识体系之HTML5前端校招知识体系之HTML5
啥是HTML5？官方说HTML5 是下一代的 HTML...
本文主要介绍HTML5三个方面的知识，继续往下看看吧。
语义化标签
canvas&svg
响应式meta
一、语义化标签
语义化标签的优点：
比<div>标签有更加丰富的含义，...[2019/9/27]
XPath匹配标签使用text()判断获取结果失败/为空的问题及解决方法
XPath当匹配标签判断text()判断内容失败的问题及解决
问题复现
在爬取网站的时候我使用XPath去抓取网页上的内容，XPath表达式来精准获取需要的标签内容。
当我对如下一段html代码编写XPath表达式抓取的时候出现了问题，代码如下。片名两个字中间有七个空格，我想...[2019/9/27]
使用Html5中的cavas画一面国旗使用Html5中的cavas画一面国旗
使用Html5中的cavas画一面国旗，具体代码如下所示：
var canvas = document.getElementById("canvas"); 创建一个cavas画板
var context = canvas.getContext(''2d''...[2019/9/26]
git远程仓库常用命令
1. git add . 将工作区的文件推到暂存区；
2. git commit -m " 备注信息"&...[2019/9/25]
jquery model 框设定jquery model 框设定
js
function searchItemInfo(conditionNo,lotCD,itemKey) {
var conditionNos=conditionNo+":"+itemKey;
$(''#H5'').html(''<spring:me age code...[2019/9/24]
微信小程序前端页面书写
微信小程序前端页面书写
WXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。
一.数据绑定
1. 普通写法
<view> {{ me age }} </view>
Page({
d...[2019/9/24]
移动端横竖屏检测
1、不同视口的获取方法
获取视觉视口大小（包括垂直滚动条）
let iw = window.innerWidth,
ih = window.innerHeight;
console.log(iw, ih);
获取视觉视口大小（内容区域大小，包括侧边栏、窗口镶边和调整...[2019/9/23]
Vue+elementui 实现复杂表头和动态增加列的二维表格
先上完成的效果图：列是根据查询结果增加的
数据格式：
表头的数据取出：
data.data.forEach(element => {
this.thead.push({
品名: element...[2019/9/23]
vuex 源码分析(七) module和namespaced 详解
当项目非常大时，如果所有的状态都集中放到一个对象中，store 对象就有可能变得相当臃肿。
为了解决这个问题，Vuex允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块—&mda...[2019/9/20]
Saying goodbye to Flash in Chrome一代人的回忆FLASH
一早打开chorme就推送了这条FLASH将在2020年推出CHORME
想起了当年风靡全球的flash热潮，游戏视频动画，都由flash运行，最熟悉的童年游戏4399，小时候的天堂。
说起这个不得不说一句，那时候游戏的发展正...[2019/9/19]
vuex 源码分析(六) 辅助函数 详解
对于state、getter、mutation、action来说，如果每次使用的时候都用this.$store.state、this.$store.getter等引用，会比较麻烦，代码也重复和冗余，我们可以用辅助函数来帮助我们生成要的代码，辅助函数有如下四个:
...[2019/9/19]
HTML5?canvas
<canvas>便签用于绘制图像，图表。不过，<canvas> 元素本身并没有绘制能力（它仅仅是图形的容器） - 您必须使用脚本JavaScript来完成实际的绘图任务。既然你要画出你想要的图案，你给有画布啊，总不能在空气中画画啊，所以第一步你要创建一...[2019/9/19]
HTML5中像网页中保存cookie的实现
if(window.plus) 判断当前的设备是手机
window.localStorage.setItem("key","value"); 设置值
window.localStorage.getItem("key"); 获取值
原文链接：http: www...[2019/9/19]
html 显示 pdf
html 显示 pdf文件四种方式：
1、
<embed src="pdf/wobu.pdf" type="application/pdf" width="100%" height="100%">
2、
<iframe sr...[2019/9/19]
踩坑，vue项目中，main.js引入scss文件时报错
当我们在src目录下创建.sc 文件，并在main.js中引用，运行时会报：
ERROR Failed to compile with 1 errors 5:25:07 PMThis relative module was not found:
* ./main.sc in ...[2019/9/19]
web app升级—带进度条的App自动更新
带进度条的App自动更新，效果如下图所示：
技术：vue、vant-ui、5+
封装独立组件AppProgre .vue：
<template>
<div>
<van-dialog v...[2019/9/19]
固定定位下的div水平居中
发现了一个之前未留意的知识点，做个笔记。
当一个块级元素的父元素开启了flex布局后，我们可以很轻松的将这个元素居中对齐，可以在父元素上加
justify-content: center;
align-items: center;/*单行下的居中对齐*/
或
...[2019/9/18]
vue中使用scss
第一步
安装sc 依赖，cnpm i node-sa sa -loader -D
注：sa -loader用来解析sc 文件（-D 是 --save-dev 的简写）
第二步：
在build文件夹下的webpack.base.conf.js的rules里面添加配置
...[2019/9/18]
vue中使用element组件时事件想要传递其他参数的问题vue中使用element组件时事件想要传递其他参数的问题
在使用element的上传组件时在一下几个钩子中传递其他参数
图中是文件上传时的几个钩子，参数为文件或文件列表或者其他参数，但是现在我想在原有参数上传递其他参数。比如我想在on-succe 的钩子中传递一个自定义参数i，原本是这样写的：
:on-succe =&rdqu...[2019/9/18]
<!DOCTYPE> 标签的定义与使用
<!DOCTYPE>标签的定义
<!DOCTYPE> 声明位于文档中最前面的位置，处于<html>标签之前。<!DOCTYPE> 声明不是一个HT...[2019/9/17]
uni-app自定义导航栏按钮|uniapp仿微信顶部导航条
最近一直在学习uni-app开发，由于uniapp是基于vue.js技术开发的，只要你熟悉vue，基本上很快就能上手了。
在开发中发现uni-app原生导航栏也能实现一些顶部自定义按钮+搜索框，只需在page.json里面做一些配置即可。设置app-plus，配置编译到App平台的特...[2019/9/17]
h5中的结构元素header、nav、article、aside、section、footer介绍
结构元素不具有任何样式，只是使页面元素的的语义更加明确。
header元素
header元素是一种具有引导和导航作用的的结构元素，该元素可以包含所有通常放在页面头部的内容。header元素通常用来放置整个页面或页面内的一个内容区块的标题，也可以包含网站Logo图片、搜索表单或者其他相关...[2019/9/16]
XML处理指令
“处理指令（PIs）允许文档包含用于应用程序的指令。指令并不是文档字符数据的一部分，但是必须通过应用程序传递”。 处理指令可以用于将信息传递给应用程序。处理指令可以出现在文档任意位置的标记外部。可以出现在序言中，包括文档的类型定义（DTD），文本内容或者文档之后。
...[2019/9/16]
h5中的分组元素figure、figcaption、hgroup元素介绍
分组元素用于对页面中的内容进行分组。
figure元素和figcaption元素
figure元素用于定义独立的流内容（图像、图表、照片、代码等），一般指一个独立的单元。figure元素的内容应该与主内容相关，但如果被删除，也不会对文档流产生影响。
figcaption元素用于为fig...[2019/9/16]
vuex 源码解析(四) mutation 详解vuex 源码解析(四) mutation 详解
mutation是更改Vuex的store中的状态的唯一方法，mutation类似于事件注册，每个mutation都可以带两个参数，如下:
state ;当前命名空间对应的state
payload ;传入的参数，一般是一个对象
创建Vuex.St...[2019/9/12]
HTML5有哪些新特性，移除了哪些元素？如何处理HTML5新标签的浏览器兼容性问题？如何区分HTML和HTML5？
HTML5现在已经不是SGML的子集，主要是关于图像，位置，存储，多任务等功能的增加。
绘画canvas；
用于媒介回放的video和audio元素；
本地离线存储localStorage长期存储数据，浏览器关闭后数据不丢失；
se ionStorage的数据在浏览器关闭...[2019/9/12]
canvas生成带二维码海报的踩坑记录
canvas海报内容有背景图，圆形头像，用户昵称，链接的二维码图片。
问题如下
图片不显示
绘制渲染的时候图像不显示：是因为图片异步加载，所以canvas的操作需要放在onload事件中，否则图片会不显示，因为图片不止一张，建议放在promise中，用async，awai...[2019/9/12]
前端开发HTML5——表单标签
表单简介
Form表单主要用于用户与Web应用程序进行数据的交互，它允许用户将数据发给web应用程序，网页也可以拦截数据的发送以便自己使用。form通常由一到多个表单元素组成，这些表单元素是单行/多行文本框，下拉菜单，按钮，复选框，单选按钮，时间表单元素时 一般要配合label标签...[2019/9/11]
HTTP中get和post
HTTP中get和post的区别
GET - 从指定的资源请求数据。
POST - 向指定的资源提交要被处理的数据
GET
POST
后退/刷新
无害的
数据会被重新提交
书签
可收藏为书签
不可收藏为书签
缓存
能被缓存
不能缓存
编码类型
applica...[2019/9/10]
style属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>样式</title>
<script typ...[2019/9/10]
页面中加入地图map页面中加入地图map
1、首先要有密钥AK ，可以自己注册获取或复制别人的 。搜索百度地图API （http: lbsyun.baidu.com/apiconsole/key）
2、地图示例
<head>
<meta charset="UTF-8">
...[2019/9/10]
Http状态码整理
状态码
1开头-临时响应
100 （继续） 请求者应当继续提出请求。服务器返回此代码表示已收到请求的第一部分，正在等待其余部分。
101 （切换协议） 请求者已要求服务器切换协议，服务器已确认并准备切换。
2开头-成功响应
200 （成功） 服务器已成功处理了请求。通常，这表示服务器...[2019/9/10]
vuex 源码分析(一) 使用方法和代码结构vuex 源码分析(一) 使用方法和代码结构
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式，它采用集中式存储管理应用的所有组件的状态，注意:使用前需要先加载vue文件才可以使用(在node.js下需要使用Vue.use(Vuex)来安装vuex插件，在浏览器环境下直接加载即可,vuex会自行安装)
vuex的使...[2019/9/10]
经验首页