- 博客(9)
- 收藏
- 关注
原创 input type = file上传图片限制大小、类型、像素
我们常用到input标签来上传图片。图片有很多格式我们只需要其中的几种,就需要对用户上传的文件进行验证,在HTML5中有一个新的属性:accept文件类型限制。但是通常我们会用javascript或jQuery编写方法进行验证图片的大小限制、类型判断、像素判断。代码如下:<input type="file" onchange="handleChange(this)">f...
2019-03-17 16:15:13
4434
原创 js判断pc端和各种设备
function browserClient() { var sUserAgent = navigator.userAgent.toLowerCase(); var bIsIpad = sUserAgent.match(/ipad/i) == "ipad"; var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"...
2019-03-04 10:18:17
315
原创 前端seo优化可以做些什么?
前端seo优化:1、页面尽量采用DIV+CSS,避免使用table方式布局,简化代码结构,更利于搜索引擎分析抓取有用内容;2、重要内容优先加载,把最重要的内容,优先展现给蜘蛛;3、每个页面只能出现一次H1标签,H2标签可以多次:H1权重很高,仅次于title,一般页面的标题用H1标签;4、图片一定要添加alt属性,蜘蛛不认识图片上的内容,只能通过alt属性来判断图片要表达的内容;...
2019-01-03 16:31:46
778
原创 rem 工作原理 及 使用介绍
1、什么是rem?rem是相对长度单位。相对于根元素(即html元素)font-size计算值的倍数的一个css单位,也就是我们前端常说的适配单位rem。因为rem的特性相对长度单位,常被用来做移动适配,pc端页面不推荐使用rem。例如以下代码,渲染效果为: div的宽度为2rem=32px,高度为1rem=16px;<!DOCTYPE html><html l...
2018-12-29 17:45:37
12613
原创 DOMtoImage 将dom转化为图片
1.转化为png格式var node = document.getElementById('my-node'); domtoimage.toPng(node) .then(function (dataUrl) { var img = new Image(); img.src = dataUrl; document.body.appendCh...
2018-12-27 16:08:00
4978
4
原创 利用html2canvas将DOM元素转换成图片
直接上代码:function html2Img(){ var dom = document.getElementById('new-bill'); //需要转换的dom var imgs = $('#new-bill img'); for(var i=0;i<imgs.length;i++){ imgs[i].crossOrigin = "...
2018-12-27 15:38:05
1499
原创 js分享内容到QQ、QQ空间、新浪博客
js分享内容到QQ、QQ空间、新浪博客都是直接调用api的,很简单,不多说,直接上代码:var _title,_source,_sourceUrl,_pic,_showcount,_desc,_summary,_site;// 新浪微博分享$('.xlwb-share').on('click',function(event){ event.preventDefault(...
2018-12-19 15:07:31
1758
原创 gulp实践
一、环境搭建1、全局安装gulp:$ npm install --global gulp2、项目依赖安装:$ npm install --save-dev gulp3、在项目根目录下创建一个名为 gulpfile.js 的文件:var gulp = require('gulp');gulp.task('default', function() { // 将你的默认的任务代码放...
2018-12-19 10:24:01
226
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人