随笔分类 - 前端
摘要：前言 在h5开发调试时，为实现手机app访问localhost地址，可以使用ip地址的方式，但一般公司app出于安全考虑，会限制只能访问其自有域名（例如美团app只能访问xxx.meituan.com等）。因此，将localhost映射到xxx.meituan.com，并通过charles代理实现手
阅读全文
摘要：前言 在h5开发过程中，起初我们使用PC浏览器的手机模式打开开发中的页面，并使用控制台进行调试，但实际真机兼容性问题无法调试到；在这种情况下，我们通常使用vConsole（即移动端的控制台）来调试，但vConsole的功能和PC chrome 控制台比，想去甚远。 本文提供了通过电脑浏览器调试真机h
阅读全文
摘要：参考代码： "JQuery中国省市区街道三级、四级联动下拉菜单插件" （将代码中单纯的四级联动提取出来，对其中的bug进行了修正，并完善了一些不完美的地方） 先通过最终效果看一下功能： 代码如下： index.html:（注：请将代码中的jquery.min.js替换成你本地的jquery地址） j
阅读全文
摘要：最近需要做一个图片上传预览的功能（兼容IE8 11、chrome、firefox等浏览器），网上现有的文件上传组件（如webuploader）总是会遇到一些兼容性问题。于是我参考了一些博文（链接找不到了⊙o⊙…），自己用原生JS写了一个支持多张图片上传预览功能的Demo 先通过最终效果看一下功能：
阅读全文
摘要：2017.8月 在开发的时候遇到了移动端滚动问题，在网上找了很多办法都不行，于是自己试了下面这个方法可行。发出来希望能帮助更多的同学，大家有更好的方法也欢迎在下面分享出来~ 这里面涉及到函数节流的知识，详见JavaScript 节流函数 Throttle 详解 问题描述：页面中有一个排行榜需要滚动，
阅读全文
摘要：参考链接： 懒加载和预加载 懒加载的原理及实现 处理图片预加载时设置img的src属性和img的onload事件的位置前后顺序关系 关于图片的预加载,你所不知道的 页面中的img元素，如果没有src属性，浏览器就不会发出请求去下载图片，只有通过javascript设置了图片路径，浏览器才会发送请求。
阅读全文
摘要：参考博文： "JS 之Blob 对象类型" "在本地存储localStorage中保存图片和文件"
阅读全文
摘要：参考博文： html中，文件上传时使用的<input type="file">的样式自定义 html中<input type="file">默认样式很丑，这里用了Bootstrap按钮的样式，并获取文件名显示在其右侧 闲话少叙，直接上代码： <label for="jobData" class="c
阅读全文
摘要：在用DOM操作控制HTML时，很多初学者会把 点操作符+属性名 与getAttribute("属性名") 混淆，误以为这两种方法是等价的。 实际上， 通过getAttribute("属性名")和setAttribute("属性名","属性值") 可以获取或修改 标签上的属性值 通过 点操作符+属性名
阅读全文
摘要：参考文档：MDN HTMLElement 一、继承关系 HTMLElement继承自Element，并实现了GlobalEventHandlers和TouchEventHandlers. 二、属性方法 1. HTMLElement的普通属性 继承自父接口Element的属性 例：innerHTML,
阅读全文
摘要：直接量语法 /pattern/attributes 创建 RegExp 对象的语法： new RegExp(pattern, attributes); 一、attributes 修饰符 描述 例子 i 执行对大小写不敏感的匹配。 var str="Visit W3School";var patt1=
阅读全文
摘要：参考链接： "菜鸟教程 HTML5 内联SVG" "经典面试题（讨论canvas与svg的区别）" |Canvas | SVG| | | | |通过 JavaScript 来绘制 2D 图形|是一种使用 XML 描述 2D 图形的语言| |是HTML5提供的新元素``|历史久远，并不是HTML5转悠
阅读全文
摘要：参考博文： "Html5 canvas画图教程17:论beginPath的重要性" 先看两个例子 例1： 结果： 例2：去掉第2个beginPath() 结果： 1. beginPath canvas中的绘制方法（如stroke, fill），都会以“上一次beginPath”之后的所有路径为基础进
阅读全文
摘要：跟着 "Webpack傻瓜式指南（一）" 这个教程在安装webpack和webpack dev server的时候遇到很多问题，查了很多终于一一找到解决办法。 主要参考了这三篇博文： "moudule.js:338 throw err; Error: Cannot find module 'webp
阅读全文