自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

wangongda的博客

我的生涯

  • 博客(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指向构造函数自身;&lt;script type="text/javascript"&gt;function Gz(){alert('success')}Gz.prototype.constructor();//success&lt;/script&gt;     ...

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关注的人

提示
确定要删除当前文章?
取消 删除