sdfujichao-CSDN博客

原创微信小程序实现电商平台中的添加商品规格

在电商平台中肯定少不了添加商品规格的功能。如图：就是一个商品里边有很多给个好多个属性。之前用JQ的时候还是比较容易写出来的。因为在JQ中可以直接操作dom，直接对dom进行属性添加等处理，可以把每个元素的属性用自定义属性的方式记录在本元素上。现在用微信小程序写这个东西就开始头疼了。因为没有办法直接操作dom，也没办法获取一个元素的上下级dom，哎，每个元素都是孤立存在的，这就略显尴尬了。不过还是有...

2018-06-05 17:13:53 9556 1

转载 vue:不同环境配置不同打包命令

https://blog.csdn.net/zfangls/article/details/79990796通过vue-cli中的npm run build 打包，这个只能打包到一个环境，在实际工作中可能有生产环境，预发布环境甚至更多，每个环境的接口地址都不同，每次都需要手动修改接口地址，非常繁琐。那我们怎么才能做到执行不同的命令打不同的包呢？下面是我在实际工作中的一个解决方案：1.npm...

2019-04-12 10:10:22 1002

原创 vue中元素高度auto的收起展开动画

<template> <div> <button @click="fun_animate"...

2019-04-10 17:22:42 6823 1

原创解构

/** * * 解构：分解一个对象的结构 * 等号两边解构类似，右边必须是一个真实的值。 */let [a,b,c] = [1,2,3];console.log(a)console.log(b)console.log(c)//*********** 编译成es5以后的代码 */// var a = 1,// b = 2,// c = 3;// ...

2019-03-02 21:44:02 278

原创 es6基础 var和let

在es5中的var有一些存在的问题，1:可以重复声明。2：不支持常量。3：没有块级作用域的概念"use strict"for(var i =0; i< 3; i++){ (function(tmp){ setTimeout(function(){ console.log(tmp) }) })(i)...

2019-03-02 21:20:18 230

原创 h5中的select下拉框在ios中样式兼容问题解决方案。

h5中的下拉框在ios中是长这样的。这样式显然不能满足我们的需要，解决办法。1：设置css ： -webkit-appearance: none; 去掉默认的样式。2：右边的小三角使用一个图片定位在那里。...

2018-12-17 19:31:06 7511

原创 h5手机端在输入框失去焦点后页面没有滑动到原来位置。

在手机端经常会写输入框提交信息，有的输入框位置比较靠底部，所以点击输入框的时候浏览器会自动把页面网上滑动，但是输入完成后，也就是这个输入框失去焦点的时候页面并没有滑下来。解决办法 1：可以用浏览器提供的这个方法来实现scrollIntoView这个方法可以绑定给任意元素，让他们滑动，具体使用方法查看旭哥的这篇文章吧，就算我费劲写一顿也不如旭哥写的更有深度。CSS scroll-behavi...

2018-12-17 19:25:21 3063

原创浏览器之间的兼容问题，要求兼容到ie9+ ie浏览器滑动时候页面抖动解决方案

一般的官网项目选择jQuery会比vue好一些。jQuery是多页应用，vue是单页应用对搜索引擎的支持不好。但是官网一般的要求是ie9+，国产浏览器，谷歌和火狐更不用说了。这样就出现了浏览器的兼容问题。主要有两个方面，1：国产浏览器，2：ie浏览器。解决办法 1：对国产浏览器的兼容问题比较容易，因为一般国产浏览器都是同时具有ie内核和谷歌内核的。可以在head中添加一下几行，强制国...

2018-12-17 19:16:36 1605

原创 js中不是所有对象都继承Object，也有特例

<!DOCTYPE html><html><body> <script> /** * 大部分对象都继承于Object对象。也有特例 */ var obj = Object.create(null) console.log(obj) </s...

2018-12-10 21:08:47 980

原创 js中继承关系

<!DOCTYPE html><html><body> <script> /** * yeye -> baba -> erzi -> sunzi */ function Yeye() { this.yeye = "yeye"..

2018-12-09 21:31:43 314

原创 js的构造函数和原型链

<!DOCTYPE html><html><body> <script> function Car() { this.name = "I am a car" } Car.prototype.height = 100; var car = new C...

2018-12-09 20:37:42 229

原创 js包装类

<!DOCTYPE html><html><body> <script> /** * 包装类 * */ var str = "123"; /** * 字符串没有length属性，在执行str.length的时候系...

2018-12-09 12:09:35 164

原创 js生成对象,构造函数生成对象原理

<!DOCTYPE html><html><body> <script> /** * 1 通过定义并创建对象的实例 */ var person = {} var person = new Object(); /** *...

2018-12-09 11:35:08 441

原创 js预编译

<!DOCTYPE html><html><body> <script> /** * 1 通过定义并创建对象的实例 */ var person = {} var person = new Object(); /** *...

2018-11-30 13:20:29 137

原创 wepy根据不同打包命令配置不同的全局变量

功能需求：要求能够根据不同打包命令（测试环境，线上环境）配置出全局变量，根据这个全局变量来自动寻找对应环境的接口域名。如果仅仅做了1中的配置，仅能从配置文件中获取NODE_ENV的值，在业务代码上是获取不到的。1：在package.json文件中配置如下信息："scripts": { "dev": "cross-env NODE_ENV=dev wepy build --wa...

2018-10-23 15:58:20 2703 1

原创微信小程序上拉多次加载问题（手指放在屏幕上一直向上拉就会不停的调用加载接口）

问题描述：我们经用到上拉加载功能。官方文档上写的lower-threshold="0"，其实仅仅就是当上拉到底部的时候就调用接在接口，当滑到底部调用接口的时候我们继续上拉屏幕，结果就会出现一次上拉多次加载的问题。解决方法：我先说说思路，我就是利用bindtouchend事件，这个时间就是触摸结束时间，也就是触摸接触的时候会调用这个方法。所以我们在写完上拉加载功能后，在添加一个bindtouchen...

2018-06-05 15:04:13 6315 1

原创微信小程序-scroll-view上拉多次触发加载事件

之前那篇博客里边写了滑块的margin属性影响了滑动效果。这篇文章写一下上拉时多次触发上拉加载事件。（改好的代码如下）其实也比较简单，就是有可能没有意识到这个小细节。在官方文档中有这么一个属性（如图）。这个属性是设置距离底部多少距离是触发事件。我们吧这个属性设置成0就可以了。只有上拉到最底部才会触发。<scroll-view lower-threshold="0" class="scroll...

2018-05-09 13:49:50 6407 3

原创微信小程序-textarea获取输入值（在modal中获取值）

我的页面是这样的。我要点击微信自带的modal中按钮获取textare的输入值（下面的页面已经改好了）文档上的bindblur事件根本就满足不了使用，因为我在点击按钮后先调用了confirm方法，然后才会调用bindblur事件的方法获取textare值。所以就没办法进行了。网上有的博客中写的是用form表单触发的事件，这样就能先触发bindblur事件获取textare值，然后在触发点击按钮的事...

2018-05-09 11:53:31 20120 1

原创微信小程序坑-scroll-view滑动列表（就一行，没有填满屏幕就会触发上拉加载事件）

比方说如下图片中有一个滑动列表。我的这个页面只有一行数据，按理说我们滑动时候是不应该触发上拉加载的，因为滑动的scroll-view元素高度是设置的100%。结果我这里就触发了上拉加载事件。图中两个箭头，箭头1的地方是scroll-view的一个子元素的margin-top如下图代码。原因：就是<view wx:for="{{arr}}" class='item'>元素设置margin...

2018-05-09 11:43:15 8549 3

原创微信小程序滑动穿透事件处理方案

滑动穿透事件处理：亲测可行！在下面这个图中只有箭头值的地方是滑动的区域，但是当用手滑动上部红色区域的时候下面的滑动区域也跟着滑动，这个效果不是我们希望的。给上面红色区域添加这个事件catchtouchmove="move" 。然后在js中在实现这个方法 move: function(){},这样就可以了。其实这个现象的出现就是事件冒泡传递过去了。catchtouchmove属性就是去掉冒泡的事件绑...

2018-04-27 13:25:29 5900

原创 java中.equals()方法和“==”的区别

1：当基本数据类型比较的时候，“==”（基本数据类型没有.equals()方法），比较的是数值是否相等。2：当引用数据类型的时候，.equals()和“==”比较的时候内存地址是否相同（是否是同一个东西）。并且“==”和.equals(）功能一样。3：String类重写了.equals()方法，比较的是两个内容的值是否相等。...

2018-03-19 13:53:27 149 2

原创 java 单例模式

//单例模式class ArrayUtil{ // 1自己创建一个自己的对象 private static ArrayUtil instance = new ArrayUtil(); // 2 私有化自己的构造函数，防止外界创建新的对象 private ArrayUtil(){}; // 3 暴露一个静态方法，用于获取自身的对象 public static ArrayUtil g

2017-11-20 20:02:56 197

原创 java——引用类型参数传递

// 引用类型参数public class test1{int num = 1;public static void main(String[] args){ int[] arr = new int[]{19, 30};System.out.print("change_pre arr =");for (int i = 0; i System.out.pri

2017-10-08 11:34:12 445

原创 Java——值传递

//public class test1{int num = 1;public static void main(String[] args){ int x = 12;System.out.println("chage_pre X=" + x);change(x);System.out.println("chage_after X=" + x);}sta

2017-10-08 10:52:44 181

原创 JS中null和undefine的区别

数据类型 undefine null number string boolean Object1： undefine：引入这个值是为了区分空对象指针和未经初始化的变量。未经初始化的变量默认就取undefine。只有一个值空对象指针：未分配或者尚未指向任何地方的指针。可以确保不指向任何对象或者函数。未经初始化的变量：可能指向任何地方。2： null：null是一个不存在的对象，就是没

2017-05-08 17:13:09 1281

转载 h5利用缓存优化性能

转载出处：http://www.cocoachina.com/webapp/20151217/14718.html1 H5 缓存机制介绍H5，即 HTML5，是新一代的 HTML 标准，加入很多新的特性。离线存储（也可称为缓存机制）是其中一个非常重要的特性。H5 引入的离线存储，这意味着 web 应用可进行缓存，并可在没有因特网连接时进行访问。H5 应用程序缓存为应用带来三

2016-09-10 12:16:29 5157

原创前端整站的性能优化

整站的性能优化可以从以下几个大的方面来做。加载优化、一：加载优化：1：合并css，JavaScript代码，压缩代码。2：合并小图片，使用css精灵。3：利用缓存存储数据。4：使用长cache。5：使用外联样式引入css和JavaScript。6：启用GZip。7：使用首屏先加载8：使用按需加载。9：通过滚动加载。10：通过Media Query加

2016-08-15 19:34:04 584

转载模块化加载的实现

原文链接：http://caibaojian.com/module-definition.html浅谈模块化加载的实现原理A-A+前端博客•2015-03-04•前端开发•AMD | CMD | JavaScript | RequireJS | SeaJS•1913View0文章目录一、模块化加载的技术原理1. 数据模

2016-08-15 18:08:53 1611

转载为什么h5移动端是单页面的应用

优点：1、具有桌面应用的即时性、网站的可移植性和可访问性。2、用户体验好、快，内容的改变不需要重新加载整个页面，web应用更具响应性和更令人着迷。3、基于上面一点，SPA相对对服务器压力小。4、良好的前后端分离。SPA和RESTful架构一起使用，后端不再负责模板渲染、输出页面工作，web前端和各种移动终端地位对等，后端API通用化。5、对前端人员javascript技能要求更

2016-08-15 18:04:57 3485

转载 JS实现异步编程的几种方式

转载出处：http://www.ruanyifeng.com/blog/2012/12/asynchronous%EF%BC%BFjavascript.htmlJavascript异步编程的4种方法作者：阮一峰日期： 2012年12月21日你可能知道，Javascript语言的执行环境是"单线程"（single thre

2016-08-09 09:57:40 3673

转载 JS连等赋值

转载出处：https://segmentfault.com/a/1190000004224719有这样一个热门问题：var a = {n: 1};var b = a;a.x = a = {n: 2};alert(a.x); // --> undefinedalert(b.x); // --> {n: 2}其实这个问题很好理解，关键要弄清下面两个知识点：J

2016-08-09 09:54:32 470

转载前端性能优化

转载出处：http://www.cnblogs.com/lei2007/p/3262897.html除了自己总结：1. 减少http请求，2.压缩并优化js/css/image 3.尽量静态页面，从简原则 4.代码规范(详见：个人知识体系思维导图)从yahoo 新学到的：网页内容减少http请求次数80%的响应时间花在下载网页内容(im

2016-08-08 17:01:27 251

转载提高前端性能

梳理：提高前端性能方面的处理以及不足这篇文章发布于 2013年04月3日，星期三，13:52，归类于 css相关。阅读 61301 次, 今日 17 次by zhangxinxu from http://www.zhangxinxu.com本文地址：http://www.zhangxinxu.com/wordpress/?p=3152一、清明时节雨纷纷

2016-08-08 16:52:04 364

转载前端性能优化五：CDN

CDN--前端性能优化CDn http://www.bootcdn.cn/jq CDN的全称是Content Delivery Network，即内容分发网络。其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定。通过在网络各处放置节点服务器所构成的

2016-08-06 14:10:14 5417

转载前端性能优化四：

我对网站优化总结了几点：网站结构优化，前端代码优化，网页设计优化，链接优化等四个方面。每个优化细节，都产生着交叉式的影响，而且对网站产生着不同的作用。然而前端代码是网站的基础语言，也是搜索引擎认知的语言，所以每个网站都要重视前端代码，今天分享一下，我是如何进行优化前端代码的。前端代码主要包括CSS语言和HTML语言。这里主要说一下CSS代码优化。Css代码优化对网站的好处是：

2016-08-06 13:12:15 531

转载 JS代码优化三：页面优化

影响用户访问的最大部分是前端的页面。网站的划分一般为二：前端和后台。我们可以理解成后台是用来实现网站的功能的，比如：实现用户注册，用户能够为文章发表评论等等。而前端呢？其实应该是属于功能的表现。而我们建设网站的目的是什么呢？不就是为了让目标人群来访问吗？所以我们可以理解成前端才是真正和用户接触的。除了后台需要在性能上做优化外，其实前端的页面更需要在性能优化上下功夫，只有这

2016-08-06 12:53:50 1627

转载 JS代码优化一：谷歌浏览器的timeline工具的使用

谷歌浏览器Timeline用法详解:大家都知道，谷歌浏览器自带的相关工具是前端开发人员的利器。点击F12会弹出一个界面，顶部带有功能的选项卡，其中有几个功能强大，但是相对较为复杂，比如Timeline,console和network。（1）.关于console的使用可以参阅谷歌控制台console相关命令介绍一章节。（2）.关于network的使用可以参阅谷歌浏览器network用

2016-08-06 11:41:10 3513

转载 JS代码优化的几种方式

如果你问我网站中最影响网站打开速度的是什么？我会告诉是网站中的javascript，简称JS。模板中引用的JS文件越多，打开速度越慢，这点我深有体会，不信你看看卢松松博客首页，使劲优化后依然有100K的文件。细读完这篇文章，够你优化大半天的了，关于JS优化方法大都脱离不了这三种方法。（网页总大小为155.k，而JS就占了100.3K）是时候优化下JS了关于JS优化的

2016-08-05 20:45:13 6125

转载 ajax内存泄漏的解决方案以及长连接和短连接的详解

转载出处：http://bbs.csdn.net/topics/340234998楼上的情况，现在也出现了。我们在用jquery做一个长轮询的服务，使用ajax不断请求。后来功能没有问题，性能测试时发现IE开久了页面经常卡死，内存只增不减。每次jquery的Ajax请求都会创建一个xmlHttprequest对象，理论上讲，长连接的请求是一个无限递归，请求数量是非常大的，但是由于每

2016-08-04 14:50:31 2058

转载 JS中表达式的理解

转载出处：作者：郑航链接：http://www.zhihu.com/question/39420977/answer/81250170来源：知乎著作权归作者所有，转载请联系作者获得授权。表达式：是由运算元和运算符(可选)构成，并产生运算结果的语法结构。以下在ES5中被称为基本表达式（Primary Expression）this、null、argum

2016-08-04 14:45:04 4673

贪吃蛇源码下载！JS实现。附带运行图片。

空空如也