最近在研究vue组件的学习，给自己留个笔记，也分享给大家，希望能对大家有所帮助<!DOCTYPE html> <html><head><meta charset="utf-8"><title>Vue 测试实例-组件嵌套二种方式</title><script src="//cdn.bootcss.com/vue/2.1.10/vue.js"></script> </head><body><div id="app"><Itemlist1><Item v-for="item in items1" :data="item"/></Itemlist1><Itemlist2 :itemlist="items2"></Itemlist2></div><script>Vue.component(Item,{te...
?最近在学习VUE.js 中间涉及到JS全局变量，与其说是VUE的全局变量，不如说是模块化JS开发的全局变量。 1、全局变量专用模块 就是以一个特定模块来组织管理这些全局量，需要引用的地方导入该模块便好。 全局变量专用模块 Global.vue <script type="text/javascript"> const colorList = [#F9F900,#6FB7B7,#9999CC,#B766AD,#B87070,#FF8F59,#FFAF60,#FFDC35,#FFFF37,#B7FF4A,#28FF28,#1AFD9C,#00FFFF,#2894FF,#6A6AFF,#BE77FF,#FF77F...
React-router 4介绍了在router4以后，如何去实现按需加载Component，在router4以前，我们是使用getComponent的的方式来实现按需加载的，router4中，getComponent方法已经被移除，下面就介绍一下react-router4是入围和来实现按需加载的。 1.router3的按需加载方式route3中实现按需加载只需要按照下面代码的方式实现就可以了。const about = (location, cb) => {require.ensure([], require => {cb(null, require(../Component/about...
程序员有一种惯性思维，就是看见一些会动的东西（带点科技含量的，猫啊，狗啊就算了），总要先想一遍，这玩意用代码是怎么控制的。比如电梯，路边的霓虹灯，遥控器，小孩子的玩具等，都统统被程序员“意淫”过。 有时候还会感觉程序员看世界会看的透彻一点............. 想必大家都玩过刮刮乐，下面就介绍一种刮刮乐的移动端实现方式！用到canvas 1、用HTML 5 canvas globalCompositeOperation 属性实现刮刮乐 思路： （1）首先需要...
js加载的缺点：加载工具方法没必要阻塞文档，过多js加载会影响页面效率，一旦网速不好，那么整个网站将等待js加载而不进行后续渲染等工作。 有些工具方法需要按需加载，用到再加载，不用不加载，。 默认正常模式下下，JS是同步加载的，即优先加载JS，只有当JS文件下载完，dom和css才开始加载，当某些时候我们需要JS异步加载，我们可以通过以下方式来设置异步加载,不同情况下选取不同方式即可 1.defer:deferJS异步下载，dom结构解析...
延迟加载也称为惰性加载，即在长网页中延迟加载图像。用户滚动到它们之前，视口外的图像不会加载。这与图像预加载相反，在长网页上使用延迟加载将使网页加载更快。在某些情况下，它还可以帮助减少服务器负载。 延迟加载的优点： 提升用户的体验，如果图片数量较大，打开页面的时候要将将页面上所有的图片全部获取加载，很可能会出现卡顿现象，影响用户体验。因此，有选择性地请求图片，这样能明显减少了服务器的压力和流量，也能够...
前言 在开发移动端页面的时候，为了提高用户体验，通常会给被触控的元素加上一个效果来对用户的操作进行反馈。这种反馈主要有三种实现方式，有需要的朋友们下面来一起看看吧。 一、伪类:active ：active伪类常用于设定点击状态下或其他被激活状态下一个链接的样式。最常用于锚点<a href="#">这种情况，一般主流浏览器下也支持其他元素，如button等。在多按键的鼠标系统中，：active只适用于主按键，目前的大部分情况都是左键即主键...
网站申请不到支付宝接口、微信接口，免接口收款实现方式。 由于客户网站需要支付，但是又申请不到接口，找了一个第3方的接口，每用几天就不行了，所以研究了一下 现在网上流行的付款方式。 很多非正规业务网站申请不到支付宝的即时到帐接口，微信收款接口也申请不到。但是又必须需要付款接口，怎么办。 现在网上有很多这种免接口实现方式， 主要有2种方式： 1，申请第3方的支付，或者直接自己搭建一个第3方网站。这个网站是正规网站...
jQuery.data() 的作用是为普通对象或 DOM Element 附加（及获取）数据。 下面将分三个部分分析其实现方式： 1. 用name和value为对象附加数据；即传入三个参数，第一个参数为需要附加数据的对象，第二个参数为数据的名称，第三个参数为数据的值。当然，只是获取值的话，也可以不传入第三个参数。 2. 用另一个对象为对象附加数据；即传入两个参数，第一个参数为需要附加的数据对象（我们称之为“obj”），第二个参数也是一个对象（我...
<span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);">昨天项目搜索的时候报错，蛋疼的是生产库中的，看了下日志，原因是用户搜索的时候输入了特殊字符，没办法最快捷的办法是直接把用户输入的数据进行筛选，去掉特殊字符</span>有些特殊字符传入到后台是会产生错误的 有可能会sql注入，所以从根本上拦截 下面一起探讨下input禁止输入特殊字符的方式： 方式一：拿到value值以后 在你传...
本文实例为大家分享了jquery轮播实现代码，供大家参考，具体内容如下 1.闪现方式的轮播 不论述，实现比较简单，效果也比较好 2.滑动轮播 以下面的html代码为例（向左滑动） <div class="example" style="overflow: hidden; width: 266px;"> <ul style="width: 798px; float: left; height: 216px; margin-left: 0px;"><li style="width: 266px; float: left; height: 216px;"></li><li style="width: 266px; float: left; height:...
前言 项目需求要弄个瀑布流的页面，用的是waterfall这个插件，感觉还是可以的，项目赶就没自己的动手写。最近闲来没事，就自己写个。大致思路理清楚，还是挺好实现的... 原生javascript版 <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>瀑布流-javascript</title><style>*{margin:0;padding:0;}#content{position: relative;margin:0 auto;}.box{padding:10px;float: left;}/*首行浮动，第二行开始绝对定...
最近发现jQuery一个对象的事件可以重复绑定多次，当事件触发的时候会引起代码多遍执行。 下面是一个click事件被重复绑定的示例: function reg_button_click(){$("#button).click(function(){alert("button click");}); } $(document).ready(function(){#重复注册3次reg_button_click();reg_button_click();reg_button_click();#触发的时候 出现3个alert$(#button).click(); });下面给出解决方法： 对于需要重复绑定的场景，再事件注...
jQuery绑定事件-多种实现方式总结 <html> <head> <meta charset="utf-8" /> <script src=https://pan.baidu.com/s/1o8GiuOq?qq-pf-to=pcqq.c2c></script> </head><body> <input type="text"/> <input type="button" value="button1"/> <script> $(function(){var text = $(":text");var button = $(":button");//调试器记录日志 console.log("message"); 如：火狐浏览器，打开FireBug(按F12)//触发单个事件：两种方式button.bind("...
本文实例为大家分享了jQuery绑定事件多种实现方法，供大家参考，具体内容如下 <html> <head> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script><!--百度CDN--> </head><body> <input type="text"/> <input type="button" value="button1"/> <script> $(function(){var text = $(":text");var button = $(":button");//调试器记录日志 console.log("message"); 如：火狐浏览器，打开...