- 博客(92)
- 收藏
- 关注
原创 常见数据类型的克隆(内含对象的深度克隆)
function clone(obj) { var copy; switch(typeof obj) { case 'undefined': break; case 'string': copy = obj; break; case 'blooean': copy = obj; break;
2017-09-24 20:06:32
654
原创 使用jquery.qrcode.js生成二维码
自从期末考试后 已经很久没写博客了 最近学了一手二维码生成 还真是简单又好用 这里简单说一下:使用的是jquery的插件jquery.qrcode.js;1.无规定生成 $(function() { $('#qrcode').qrcode("110"); })2.规定大小生成$('#qrcode').qrcode({
2017-07-17 21:14:48
896
原创 基于jquery的轮播图组件开发-1
本来是想一口气把功能写完,好吧...结果就是只写了部分小功能,剩下的后续再补上。代码方面分区还有些乱,恩,毕竟写了应该多少有些收获吧。这里留一份代码: < > * { m
2017-06-30 17:45:43
400
原创 angular的一个小问题
用过angular的相信ng-bind一般都没有angular表达式使用的多,但其实在一些情况下:比如当你把引入angular框架的script标签放在body内最下面且同时网速较慢的情况下,会出现页面部分内容就是由你写的angular表达式组成,并没有初始化或者运算化。而原因也很简单,因为浏览器解析html的顺序所致。而解决方法也是有的,只需添加一个类名:‘ng-bloak’然后就ok了。
2017-06-26 22:05:21
212
原创 使用Jquery的getJSON跨域请求蘑菇街图片资源实现瀑布流
先看下效果ps:这是一个可以自适应屏幕的瀑布流;那么来看看怎么去实现1.找到蘑菇街的xhr请求地址;2.从这个请求中找到我们需要的图片资源请求路径,从下图可以看出它在请求回的对象的多层属性下;3.通过下图对比,找到它的控制参数(图中可以看出它是通过page去控制的)4.结合普通瀑布流和上述资料实现跨域请求的瀑布流,下面上代码:
2017-06-26 00:00:41
933
原创 浅谈网站的性能优化1
1.减少http请求这个应该是最容易想到的了,减少http请求的方法有很多:(1).css sprites、字库文件(自己一般使用阿里矢量图标库);(2).减少外链的js脚本文件,比如使用requeir.js,它不仅可以帮你把众多的js脚本文件加载变为一个脚本文件的加载还可以实现js的模块化编程。2.压缩文件(1).css和js文件的压缩,比如就像最常见到的jquery一样,我
2017-06-24 17:53:01
414
原创 Less的常见用法
//声明初始化变量@xs:200px;//使用上面的变量.box1{ width:@xs; height:@xs; margin-top: 10px; background: red;}//此时.box1是一个混合,可以如下使用.box2{ .box1;}//预设一个混合.class1{ margin-top: 10px; bo
2017-06-21 15:27:33
3162
原创 封装ajax-2
function uri(obj){ var arr=[]; for(var i in obj){ arr.push(encodeURIComponent(i)+'='+encodeURIComponent(obj[i])); } return arr.join('&'); }function createajax(obj){ if(window.XMLHttpRequest){
2017-06-19 14:37:43
238
原创 原生js通过jsonp跨域-模拟搜索引擎
效果还不错 就差加上键盘控制了...代码如下: 帅哥搜索 * { margin: 0; padding: 0; } form { position: absolute; left: 50%; top: 40%; } form input:nth-child(1) {
2017-06-17 15:39:55
363
原创 跨浏览器的事件处理(套装)
var crossthings={ getevent:function(ev){ return ev||event; }, gettype:function(ev){ return ev.type; }, gettarget:function(ev){ return ev.target||ev.srcElement;
2017-06-16 18:03:16
229
原创 两个小效果(美女系列..)1.纯css和css3实现;2.jquery实现.
恩 录出来有些卡...下面跟上代码: *{margin:0;padding:0} body{background: #272727;} #box #uu li a img{width:200px;height:200px;float: left;box-shadow: 2px 2px 5px;} #box #uu li{list-st
2017-06-15 13:52:20
711
原创 简易分页组件
还是第一次写分页用的页码组件 整个过程就是找规律 找它们的共通点 本来想写成灵活度比较高 多方面都提供接口的组件模式 然而在控制展现的页码数量这里 即便找到了规律共性也没能转化为靠谱实用的程序 最后不得已写死为七页了... 下面是代码..window.onload = function() { page({ id: 'yema', //分页容器 n
2017-06-14 18:11:51
290
原创 动态加载脚本和样式表函数的简单封装
//1.function moveloadjs(url){var script=document.createElement('script');script.src=url;script.type='text/javascript';var scrt=document.getElementsByTagName('script')[0];scrt.parentNode.in
2017-06-05 21:39:19
259
原创 斐波那契数列相关
1.斐波那契指定项数的输出(就是输出指定的n项斐波那契数列 以数组的形式)//1、1、2、3、5、8、13、21、34、55function fbnq(n){ //n表示需要多少项 if(n==1){return arr[1]; //如果一项 直接返回arr[1]}else if(n==2){return arr[1,1];//如果两项 返回arr[1,1];}
2017-06-04 15:57:36
443
原创 入手两个基础排序算法
关于算法这个东西 除了冒泡排序 平常也就没其他的接触了 虽然js自带了sort这个方法 但是还是需要自己去写比较函数 不像php中sort那么方便 而对于基础的排序算法 也就有了一定的需求 那么 就来看看新入手的这两个排序算法吧(这两个感觉简单 于是就学了 可能是相性和我比较符合吧 哈哈)1.选择排序:在时间复杂度上表现最稳定的排序算法之一,而且据说不会占用额外内存,适合小型排序;var
2017-06-03 21:32:40
335
原创 根据事件类型做出反应
window.onload=function(){var box=document.getElementById("box");function thingstype(ev){var e=ev||event;switch(e.type){case'click':e.target.style.background='blue';break;case'mouseenter':e
2017-06-02 23:19:08
313
原创 回顾面向对象-选项卡demo
window.onload=function(){new Gz();}function Gz(){var that=this;this.btns=document.getElementsByTagName('input');this.boxs=document.getElementsByTagName('div');for(var i=0;ithis.btns[
2017-05-30 18:28:21
255
原创 跨浏览器事件的添加与删除
var webadd={addtings:function(obj,type,hanshu){if(obj.addEventListener){obj.addEventListener(type,hanshu,false);}else if(obj.attachEvent){obj.attachEvent('on'+type,hanshu)}else{obj['
2017-05-29 18:07:13
377
原创 以前写的商品放大镜demo
#box1{width:400px;height:400px;border:solid 1px blue;position: relative;left:0;top:0;background: url(img/TB2KJgidB0kpuFjy1zdXXXuUVXa_!!1580757763.jpg_400x400.jpg)no-repeat;float: left;
2017-05-23 20:24:59
462
原创 js中控制物体无延迟移动的思路
window.onload=function(){var box=document.getElementById("box");//初始化状态var left=false;var top=false;var right=false;var down=false;//状态1document.onkeydown=function(ev){var e=ev||even
2017-05-23 20:23:32
1345
原创 随机换色的两种思路
直接上js代码看看吧: window.onload=function(){var att=['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];var yanse='#';var box=document.getElementById("box");//方法一// box.onclick=func
2017-05-23 20:22:10
499
原创 寄生组合式继承
function create(obj){ function Df(){};Df.prototype=obj;return new Df();}function createexp(newobj,oldobj){var cloneprototype=oldobj.prototype;cloneprototype.constructor=newobj
2017-05-21 14:49:57
382
原创 寄生式继承
function create(obj){ function Df(){};Df.prototype=obj;return new Df();}function createex(obj){var clone=create(obj); //在之前基础上的加强clone.age=666;//这里面有一个中间对象clone.say=funct
2017-05-21 14:47:58
515
原创 原型式继承
var person={name:'li',sex:'boy'}// alert(person.name);//lifunction create(obj){ //接收一个参数function Df(){};//创建空的构造函数Df.prototype=obj;//将参数对象的属性方法赋给构造函数return new Df();//返回该构造函数的
2017-05-21 14:46:43
413
原创 组合式继承
function Person(){this.name='li';this.sex='boy';}function Boy(){Person.call(this)}var child=new Boy();alert(child.name);//lialert(child.sex);//boy//缺点:无法继承超类型原型上的;
2017-05-21 13:36:38
337
原创 借助构造函数实现继承(解决引用类型问题)
function Person(){this.name='li';this.sex='boy';}function Boy(){Person.call(this)}var child=new Boy();alert(child.name);//lialert(child.sex);//boy//缺点:无法继承超类型原型上的;
2017-05-21 13:34:29
287
原创 借用实例化和prototype实现继承
function Person(){this.name='li';}Person.prototype.go=function(){alert('hi');}function Boy(){}Boy.prototype=new Person();var man=new Boy();alert(man.name);//liman.go();//hi
2017-05-21 13:33:27
276
原创 js事件设计模式-含参数多事件的添加和移除
相对之前 更加完整实用了function creatfunction(obj,skill){if(!obj){obj=window;}var arr=[]; for(var i=2;iarr.push(arguments[i]);} return function(){obj[skill].apply(obj,arr);}}//给带参
2017-05-20 20:26:29
370
原创 js事件设计模式-事件处理流程传参问题
暂时是这么理解的.....function creatfunction(obj,skill){//这里写一个将处理事件流程的函数转化为无参数函数的函数(其实就是在它外层包一个无参数函数)if(!obj){obj=window;}//如果没传入哪个对象的参数 让他默认指向window var arr=[]; //建立一个空数组 用来存放传进来的事件参数for(var i=2;
2017-05-20 14:46:35
506
原创 借鉴prototype.js实现继承
Object.fm=function(son,father){ //首先对内置对象设置一个方法 for(var arr in father){ //利用 for in 反射机制 son[arr]=father[arr];//将父类属性方法都给子类复制一套 实现继承}return son; //返回引用}Object.prototype.fm=function
2017-05-19 20:33:43
414
原创 对利用反射和prototype实现继承的简单封装
function People(){this.name='chenmin';this.sex='girl';this.age=22;this.speak=function(){alert('qzuishuai')}}People.prototype.skill='walk';Function.prototype.fromClass=function(baseCl
2017-05-18 23:48:19
208
原创 用反射机制和prototype实现继承
function People(){this.name='chenmin';this.sex='girl';this.age=22;this.speak=function(){alert('qzuishuai')}}People.prototype.skill='walk';function Woman(){}for(var arr in People.
2017-05-18 23:41:48
338
原创 显性的调用构造函数(感觉没太大用处)
利用构造函数原型对象下的constructor指向构造函数自身;<script type="text/javascript">function Gz(){alert('success')}Gz.prototype.constructor();//success</script> ...
2017-05-18 00:38:02
554
原创 命名空间?
var NameRoom=new Object;NameRoom.Person=function (){this.name='陈浩';this.age=90;}var person=new NameRoom.Person();alert(person.name);
2017-05-18 00:32:32
203
原创 数据类型的一些测试
// 三大基础类型// var str='ni';// alert(typeof str);//string// var x=4;// alert(typeof x);//number// var t=true;// alert(typeof t);//Boolean// 其他基础类型// var x=undefine
2017-05-18 00:29:41
332
原创 用for in反射来无限制的修改css
div{width:400px;height:400px}function changecss(obj,json){for(var i in json){obj.style[i]=json[i];}}var box=document.getElementsByTagName('div')[0];changecss(box,{backgro
2017-05-18 00:22:10
280
原创 用for in实现js的反射
// 反射机制指的是程序在运行时能够获取自身的信息。function Person(){this.name='jack cheng';this.age=33;this.move=function(){alert('fly');}}var human=new Person();for(var i in human){console.log('Person.
2017-05-18 00:19:38
247
原创 字符串中的一些方法
var str='yang guang';var stt=' s ';var st='g,d,f';//截取// var strr=str.slice(2,5);// alert(strr);//ng\s;// var strr=str.substring(2,6);// alert(strr);//ngg// 以上都左闭右开;// var strr=str.s
2017-05-17 14:19:53
179
原创 js中的数组方法
var arr=[2,45,657,3,56,33,22,0,756];//9项// arr[9]=34;//通过不存在的数组项增加数组;// alert(arr);// arr.length=8;//通过数组长度删除数组 会从最后一项开始;// alert(arr);// arr.length=10;//通过数组长度增加数组 新增的会是undefined;// alert
2017-05-16 23:56:25
212
原创 用sort去按属性排序数组
var arr=[{name:'zhangsan',age:'28'},{name:'lisi',age:'45'}]function pai(sx){// this.name='rr';// alert(window.name);//rr// alert(this.name);//rr// alert(pai.name);//pai;return function(obj
2017-05-16 19:27:39
696
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅