sweetllh-优快云博客

原创 flex布局详解

1、阮一峰http://www.ruanyifeng.com/blog/2015/07/flex-grammar.htmlhttp://www.ruanyifeng.com/blog/2015/07/flex-examples.html2、flex-basic属性https://mp.weixin.qq.com/s?__biz=MzA5NzkwNDk3MQ==&mid=2650587826&idx=1&sn=785aa994a3f046f55c21b2c1478639

2020-10-18 10:36:22 469

原创微信公众号网页开发

基本配置1.设置—公众号设置—功能设置—配置JS接口安全域名2.开发—基本配置发者ID(AppID) 开发者密码（AppSecret）3.IP白名单配置填写当前本地开发IP地址和服务器IP地址开发jQuery + rem + flex或WeUi、SUI(阿里巴巴共享业务事业部SDC团队（UED）)、Mint-UI(饿了么)开发页面<meta name="viewport" content="width=device-width,initial-scale...

2020-10-17 17:43:08 3632 1

原创 redux总结

import { createStore,combineReducers } from 'redux'//reducer (state, action) => newState var reducer = function (state = {}, action) { switch (action.type) { case 'SET_NAME': ...

2019-03-27 16:33:48 345

转载 vue单选全选全不选删除

https://lanhuapp.com/web/#/item/board?pid=615ac805-acc6-4d0a-ac80-2c7692dbb452

2018-08-28 15:02:17 1370 1

原创 px rpx pt em rem单位

一. rpx :微信小程序开发中新出了尺寸单位rpx（responsive pixel）: 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px = 1物理像素。设备 rpx换算px (屏幕宽度/750) ；px换算rpx (750/屏幕宽...

2018-07-22 11:16:17 1929

原创 js设计模式

发现两篇js设计模式的文章，写得通俗易懂，大家可以一起学习下https://www.cnblogs.com/libin-1/p/6337115.htmlhttps://www.cnblogs.com/tugenhua0707/p/5198407.html

2018-02-04 11:07:21 391

原创表格插件汇总

常用表格插件附官网或中文网：Datatables、EasyUI Datagrid 数据网格、pqgrid、jqGrid、bootstrap-table一、Datatables中文网：http://www.datatables.club/Datatables是一款jquery表格插件。它是一个高度灵活的工具，可以将任何HTML表格添加高级的交互功能。增删改查功能完整：1、

2018-02-03 15:56:33 13035

转载 JavaScript操作SVG画图库：基于jquery的插件jquery.svgmagic.js

1.svgmagic.js插件操作SVG方法：示例：http://blog.youkuaiyun.com/linshutao/article/details/30053233 jquery.svgmagic.js地址：https://github.com/dirkgroenen/SVGMagic http://www.jqcool.net/jquery-svgmagic.html http://www

2017-10-22 11:09:24 2753

原创 HTML5数据库查询

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //1.创建数据库(数据库名，版本，描述信息，大小) var db=openDatabase('mybd','1

2017-07-30 23:11:32 7379

原创 HTML5本地数据库写留言版功能

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box{ width:300px; height:200px;

2017-07-30 23:10:37 2723 1

原创 HTML5本地数据库来做注册登录功能

注册<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 用户名：<input type="text" name="" id="" value="" /> 密码： <input type="passwor

2017-07-30 23:08:04 29569 5

原创 HTML5 本地数据库

HTML5 Web SQL 数据库在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage，这两个是以键值对存储的解决方案，存储少量数据结构很有用，但是对于大量结构化数据就无能为力了，灵活大不够强大。Web SQL 数据库 API 并不是 HTML5 规范的一部分，但是它是一个独立的规范，引入了一组使用 SQL 操作客户端数据库的 A

2017-07-29 16:33:35 1164

原创 HTML5本地存储来注册登录

注册<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/reset.css"/> <style type="text/css">

2017-07-29 16:24:23 5507 4

原创 HTML5本地存储

Cookie 数据存储到计算机中，通过浏览器控制添加与删除数据 Cookie的特点存储限制域名100个cookie,每组值大小4KB 客户端、服务器端，都会请求服务器（头信息）页面间的cookie是共享Storage sessionStorage session临时回话，从页面打开到页面关闭的时间段窗口的临时存储，页面关闭，本地存储消

2017-07-29 16:19:15 385

原创 HTML5 --地理位置

地理位置经度 : 南北极的连接线纬度 : 东西连接的线位置信息从何而来 IP地址 GPS全球定位系统 Wi-Fi无线网络基站地理位置对象 navigator.geolocation 单次定位请求：getCurrentPosition(请求成功，请求失败，数据收集方式) 请求成功函数经度 : coords.longitude 纬度 : coords.

2017-07-29 15:37:45 551

原创 HTML5拖放事件与购物车案例

l拖放事件 •draggable ： –设置为true，元素就可以拖拽了 •拖拽元素事件 : 事件对象为被拖拽元素 –dragstart ,拖拽前触发 –drag ,拖拽前、拖拽结束之间，连续触发 –dragend , 拖拽结束触发 •目标元素事件 : 事件对象为目标元素 –dragenter ,进入目标元素触发，相当于mouseover –dragover ,进入目标、离

2017-07-29 14:54:27 2019

原创深度拷贝、浅度拷贝、数组的拷贝

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript">// var a={"name":"hello"};// console.log(typeof(a));

2017-07-29 14:29:03 382

原创 canvas与audio结合

<!DOCTYPE html ><html ><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script>window.onload = function(){ var oV = document.getElementById('v1'

2017-07-29 14:24:19 1648

原创自定义播放器

<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ padding: 0; margin: 0;

2017-07-29 14:19:34 503

原创 HTML5 -video和audio的设置

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body>  <audio id="ad" controls src="img/

2017-07-29 14:19:02 745

原创 canvas绘制动态加载圆形百分比

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div> <canvas width="152" height="152" id="process"></canvas>

2017-07-29 10:45:36 2030

原创 YaHoo Web优化的14条法则

Web应用性能优化黄金法则：先优化前端程序(front-end)的性能，因为这是80%或以上的最终用户响应时间的花费所在。法则1. 减少HTTP请求次数80%的最终用户响应时间花在前端程序上，而其大部分时间则花在各种页面元素，如图像、样式表、脚本和Flash等，的下载上。减少页面元素将会减少HTTP请求次数。这是快速显示页面的关键所在。一种减少页面元素个数的方法是简化页面设计。但是否存在其他方式

2017-07-27 22:13:33 368

原创 ie和dom事件流的区别

1.事件流的区别 IE采用冒泡型事件 Netscape使用捕获型事件 DOM使用先捕获后冒泡型事件示例：点击这里冒泡型事件模型： button->div->body (IE事件流) 捕获型事件模型： body->div->button (Netscape事件流) DOM事件模型： body->div->button->button->div->body (先捕获后冒泡) 2.事

2017-07-27 14:28:56 2311

原创 git指令创建仓库上传项目多人合作

Git初始化及仓库的创建和操作一、基本信息设置 git config –global user.name ‘xxx’ git config –global user.email “xxxxx@xx.com” git config –list //查看当前配置二、创建git仓库和初始化仓库 1、选择一个合适的地方，创建一个空目录 mkdir file

2017-07-20 20:37:29 972

原创给字符串添加千分符

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> function text(str){

2017-07-06 10:23:57 778

转载浅谈Jquery中的bind(),live(),delegate(),on()绑定事件方式

一、bind() 　 bind()向匹配元素添加一个或多个事件处理器。使用方式 (selector).bind(event,data,function)event：必需项；添加到元素的一个或多个事件，例如click,dblclick等；单事件处理：例如(selector).bind(event,data,function) event：必需项；添加到元素的一个或多个事件，例如 clic

2017-07-03 20:21:33 272

原创写一个function，清除字符串前后两端的空格

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> var str = " hyu kop jkl ";

2017-07-03 16:14:55 3338

原创正则表达式验证邮箱地址

邮箱@前缀的几种类型：1、纯数字　　123456@qq.com 2、纯字母　　　　 zhangsan@qq.com 3、字母数字混合　zhang123@qq.com 4、带点的　　　　 zhang.san@qq.com 5、带下划线　　　 zhang_san@qq.com 6、带连接线　　　 zhang-san@qq.com邮箱@后缀的类型：1、123456@qq

2017-07-03 14:23:38 3732

原创 js数组去重的三种常用方法总结

第一种是比较常规的方法思路：1.构建一个新的数组存放结果2.for循环中每次从原数组中取出一个元素，用这个元素循环与结果数组对比3.若结果数组中没有该元素，则存到结果数组中Array.prototype.unique1 = function(){ var res = [this[0]]; for(var i = 1; i < this.length; i++){ var repeat = f

2017-07-03 11:17:02 378

转载浅析javaScript中的浅拷贝和深拷贝

拷贝就是把父对像的属性，全部拷贝给子对象。1、javaScript的变量类型（1）基本类型：5种基本数据类型Undefined、Null、Boolean、Number 和 String，变量是直接按值存放的，存放在栈内存中的简单数据段，可以直接访问。（2）引用类型：存放在堆内存中的对象，变量保存的是一个指针，这个指针指向另一个位置。当需要访问引用类型（如对象，数组等）的值时，首先从栈中获得该对象的地

2017-07-03 10:29:08 388

原创 JavaScript写一个方法把URL解析成对象.html

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> var url="http://www.taobao.com/in

2017-07-03 09:14:00 463

原创 call和apply的区别

1、方法定义call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.call方法:语法：call([

2017-07-03 00:11:21 448

转载 ajax的三种实现方式及解释json数据

参考博文：http://bing-zz.iteye.com/blog/1118728准备:1、 prototype.js2、 jquery1.3.2.min.js3、 json2.js后台处理程序(Servlet),访问路径servlet/testAjax:Java代码 package ajax.servlet; import java.io.IOException; i

2017-07-02 23:45:55 3643

转载 js强制类型转换

转换函数、强制类型转换、利用js变量弱类型转换。1. 转换函数：js提供了parseInt()和parseFloat()两个转换函数。前者把值转换成整数，后者把值转换成浮点数。只有对String类型调用这些方法，这两个函数才能正确运行；对其他类型返回的都是NaN(Not a Number)。一些示例如下： parseInt("1234blue"); //returns 1234 par

2017-07-01 17:34:57 512

转载 JavaScript的隐式类型转换浅析

参考博文：http://www.codeceo.com/article/javascript-type-convert.html http://www.jianshu.com/p/0f1e3ff14537JavaScript的数据类型分为六种，分别为null,undefined,boolean,string,number,object。object是引用类型，其它的五种是基本类型或

2017-07-01 17:18:56 782

转载 8种CSS清除浮动的方法优缺点分析

参考博文：http://www.5icool.org/a/201211/a1661.html为什么清除CSS浮动这么难？因为浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及 width height 属性。而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。解决浮动引起的问题有多种方法，但有些方法在浏览器兼容性方面还有问题。我根据自己的经验总结8种

2017-07-01 16:32:18 386

转载前端页面有哪三层构成，分别是什么?作用是什么?

参考博文：http://www.web92.net/870.html 最准确的网页设计思路是把网页分成三个层次，即：结构层、表示层、行为层。网页的结构层（structural layer）由 HTML 或 XHTML 之类的标记语言负责创建。标签，也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含任何关于如何显示有关内容的信息。例如，P 标签表达了这样一种语义：“这是

2017-07-01 15:59:38 30920

转载 CSS引入的方式有哪些? link和@import的区别是?

有 4 种方式可以在 HTML 中引入 CSS。 1.内联方式内联方式指的是直接在 HTML 标签中的 style 属性中添加 CSS。示例：<div style="background: red"></div>这通常是个很糟糕的书写方式，它只能改变当前标签的样式，如果想要多个 <div> 拥有相同的样式，你不得不重复地为每个 <div> 添加相同的样式，如果想要修改一种样式，又不得不修改

2017-07-01 15:47:47 1230

原创编写一个js函数用来求n的阶乘

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> //求阶乘n! 即，1×2×3×4×5×······×n（使用递归

2017-07-01 15:31:09 22988 3

原创编写一个js函数用来求一个数组中各元素之积

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script type="text/javascript"> function product(arr) {

2017-07-01 15:20:06 2903

空空如也

空空如也