纯粹JSjs
Feb 14
1.JS请求页面:如:study.yjs.com/index.html



2.跨域的服务端页面: 如:http://blog.yjs.com/jtest.php

  $data = array('a'=>'b');
  $jsondata = json_encode($data);
  echo $_GET['callback'].'('.$jsondata.')';
?>

OK,现在访问study.yjs.com/index.html,就能获取到跨域的数据了。
Jun 8

<div id='mydoc'>
111
</div>
<script>
  function EditInPlaceField(id,parent,value){
    this.id=id;
    this.value=value||'default';
    this.parentElement=parent;
    
    this.createElements(this.id);
    this.attachEvents();
  };
  EditInPlaceField.prototype={
    createElements:function(id){
      this.containerElement = document.createElement('div');
      this.parentElement.appendChild(this.containerElement);
      
      this.staticElement = document.createElement('span');
      this.containerElement.appendChild(this.staticElement);
      this.staticElement.innerHTML = this.value;
      
      this.fieldElement = document.createElement('input');
      this.fieldElement.type = 'text';
      this.fieldElement.value = this.value;
      this.containerElement.appendChild(this.fieldElement);
      
      this.saveButton = document.createElement('input');
      this.saveButton.type = 'button';
      this.saveButton.value = 'save';
      this.containerElement.appendChild(this.saveButton);
      
      this.cancelButton = document.createElement('input');
      this.cancelButton.type = 'button';
      this.cancelButton.value = 'cancel';
      this.containerElement.appendChild(this.cancelButton);
      
      this.convertToText();
    },
    attachEvents:function(){
      var that=this;
      addEvent(this.staticElement,'click',function(){ that.convertToEditable();});
      addEvent(this.saveButton,'click',function(){ that.save();});
      addEvent(this.cancelButton,'click',function(){ that.cancel();});
    },
    convertToEditable:function(){
      this.staticElement.style.display='none';
      this.fieldElement.style.display='inline';
      this.saveButton.style.display='inline';
      this.cancelButton.style.display='inline';
      this.setValue(this.value);
    },
    save:function(){
      this.value=this.getValue();
      var that=this;
      var callback = {
        success:function(){that.convertToText();},
        failure:function(){alert('SAVE ERROR!');}
      };
      //下面一般是ajax访问服务器脚本,保存数据
      //如 ajaxRequest('get','save.php?id='+this.id+'&value='+this.value);
      alert('do save');
    },
    cancel:function(){
      this.convertToText();
    },
    convertToText:function(){
      this.staticElement.style.display='inline';
      this.fieldElement.style.display='none';
      this.saveButton.style.display='none';
      this.cancelButton.style.display='none';
      this.setValue(this.value);
    },
    setValue:function(value){
      this.fieldElement.value=value;
      this.staticElement.innerHTML=value;
    },
    getValue:function(){
      return this.fieldElement.value=this.value;
    }
  };
  //添加事件@F
  function addEvent( obj, type, fn ) {    
    if ( obj.attachEvent ) {      
      obj['e'+type+fn] = fn;      
      obj[type+fn] = function(){
        obj['e'+type+fn]( window.event );
      }      
      obj.attachEvent( 'on'+type, obj[type+fn] );    
    } else {
      obj.addEventListener( type, fn, false );
    }
  }  
  //删除事件@F
  function removeEvent( obj, type, fn ) {    
    if ( obj.detachEvent ) {    
      obj.detachEvent( 'on'+type, obj[type+fn] );    
       obj[type+fn] = null;    
    } else {      
      obj.removeEventListener( type, fn, false );
    }
  }
  //根据ID获取对象@F
  var $=function(doc){
    return document.getElementById(doc);
  }
  var titleClass=new EditInPlaceField('titleClass',$('mydoc'),'Title here');
  var currentTitleText = titleClass.getValue();
  
</script>


Jun 7

<script language="javascript">
  //demo1 对象创建及动态添加方法 @F
  Function.prototype.method=function(name,fn){
    this.prototype[name]=fn;
    return this;
  }
  var Demo1 =function(){
    
  };
  Demo1.method('start',function(){alert('start');}).method('end',function(){alert('end');});
  Demo1.prototype.run=function(){
    alert('run');
    this.start();
    this.end();
  };
  
  var myDemo1=new Demo1();
  myDemo1.run();
  
  //demo2   匿名函数
  var Demo2=(function(a,b){
    return a*b;
  })(2,3);
  alert(Demo2);
  
  //demo3 闭包
  var demo3;
  (function(){
    var a=2;
    var b=4;
    demo3=function(){
      return a*b;
    };  
  })();
  alert(demo3());
  
  //demo4 对象的易变性
  var person=function(name,age){
    this.name=name;
    this.age=age;
  }
  person.prototype={
    getName:function(){
      return this.name;
    },
    getAge:function(){
      return this.age;
    }
  }
  var poly=new person('poli',16);
  var jason=new person('jason',26);
  //给所有person对象加一个getMsg方法
  person.prototype.getMsg=function(){
    return this.getName()+' is '+this.getAge()+' years old';
  }
  //只给jason这个人加一个showMsg方法
  jason.showMsg=function(){
    alert(this.getMsg());
  }
  jason.showMsg();
  
  //demo5 属性检查模仿接口
  var Com = function(){
    //给属性implomentsInterfaces添加ccc和FFF接口 [约定]Com实现了这2个接口 但是未能保证...
    this.implomentsInterfaces = ['CCC','FF'];
    //自动检查函数
    function _init(){
      if(!implements(this,'CCC','FFF')){
        throw new Error('Com is not implement all the interface');
      }
    };
    //最后进行
    _init();
  }
  //自定义一个通用的属性检查函数 双循环匹配对象和接口
  function implements(obj){
    for(var i=1;i<arguments.length;i++){
      var interFound=false;
      for(var j=0;j<obj.implomentsInterfaces.length;j++){
        if(obj.implomentsInterfaces[j]==arguments[i]){
          interFound=true;
          break;//找到了跳出循环
        }
      }
      if(interFound==false){
        return false;
      }
    }
    return true;
  }
  //看看效果:
//  Com();
  
  //demo6 鸭式检查类是否实现接口(原理就是判断一个类是否具有所有[所有其声明实现的接口所具有的函数],缺少一个就判断错误)
  
  //demo7 作用域 内嵌函数 闭包
  function demo7(){
    var b=1;
    function bar(){
      b*=2;
      return b;
    }
    return bar;
  }
  var myDemo7=demo7();
  alert(myDemo7()); //2
  alert(myDemo7()); //4 同一个实例 运行多次 同时改变了其内部私有变量的值
  var _myDemo7=demo7();
  alert(_myDemo7());//2
  
  //demo8 继承破坏封装 缺点:占内存,破坏继承
  /**
  几个概念:
  1.局部变量
   函数内部声明的变量 (var)
  2.私有函数(内嵌函数)
   函数内部声明的函数,不能被外部直接使用(function形式声明)
  3.特权函数
   函数内部声明的函数,可以被外部使用(this.形式声明),可以使用函数的私有成员
  4.prototype函数
  函数外部声明的函数,不能访问函数的私有成员
  */
  var Demo8=function(newA){
    var a;//@1
    function checkA(){ //@2
      return true;
    }
    this.getA=function(){ //@3
      return a;
    }
    this.setA=function(newA){
      a= newA;
    }
    this.setA(newA);
  };
  Demo8.prototype={
    display:function(){//@4
      alert(this.getA());
    }
  };
  var mydemo8=new Demo8(1);
  alert('下面是例子8:');
  mydemo8.display();//1
  mydemo8.setA(2);
  mydemo8.display();//2
  
  /*
   1.虽然js是面向对象的,但js自身无私有属性,公有方法,常量的说法 都是靠作用域进行代码模拟实现的。
   2.js的面向对象实质是一种松散的序列(数据结构),可以随时修改添加方法和属性
   */
  
  //demo9 类式继承 @F
  /*
  1.为了让子类继承父类,只需将子类的prototype设置为父类的一个实例就;
  2.同时将子类的constructor重新设置为子类。
  3.同时需要了解一下CALL函数,superclass.call(this,param);
  在subclass中通过此句调用superClass的构造函数,同时传递参数进去。
  下面封装了js继承的一个函数
  */
  function extend(subClass,superClass){
    var F=function(){};
    F.prototype=superClass.prototype;
    subClass.prototype=new F();//@1
    subClass.prototype.constructor=subClass;//@2
    //为子类新加一个父类属性
    subClass.superclass=superClass.prototype;
    //如果父类的constructor 与当前对象的constructor相等,则重设父类constructor
    if(superClass.prototype.constructor==Object.prototype.constructor){
      superClass.prototype.constructor=superClass;
    }
  }
  
  //demo10 原型式继承
  /*
  *  通过自定义的一个克隆类将原型(父类),拷贝给子类
  */
  var Person={  //一个原型 (父类)
    name:'defalut name',
    getName:function(){
      return this.name;  
    }  
  };
  //自己定义一个克隆函数@F
  function clone(obj){
    function F(){};
    F.prototype=obj;
    return new F;
  }
  var Author=clone(Person);//通过克隆进行继承(子类)
  Author.books=[];  //设置新的属性
  Author.getBooks=function(){//设置新的方法
    return this.books;
  }
  //使用例子
  var author=[];
  author[0]=clone(Author);
  author[1]=clone(Author);
  author[0].name='name0';
  author[1].name='name1';
  author[1].books=['json depater'];
  alert(author[0].getName());
  alert(author[1].getBooks());
  
  //demo11 掺元类 @F
  /*
  即将父类函数(或者指定函数)扩充到多个不同的类中,让这些类公用该函数.
  主要涉及一个自定义的扩充函数 augment(a,b) 将a中的方法扩充到b
  原理:首先定义一个方法集(类),然后通过augmen函数将该方法集作为第二个参数传入,将方法集中的方法赋值给实际类(第一个参数)
  */
  function augment(rClass,gClass){
    if(arguments[2]){
      for(var i=2,len= arguments.length;i<len;i++){
        rClass.prototype[arguments[i]]=gClass.prototype[arguments[i]]
      }
    }else{
      for(m in gClass.prototype){
        if(!rClass.prototype[m]){
          rClass.prototype[m]=gClass.prototype[m];
        }
      }
    }
  }
  
</script>  
May 11

<script type="text/javascript">
var i = 5;
var intervalid;
intervalid = setInterval("count_down()", 1000);

function count_down()
{
if (i == 0)
{
window.location.href = "http://www.google.com";
clearInterval(intervalid);
}
document.getElementById("show_sec_div").innerHTML = i;
i--;
}
</script>
<div id='show_sec_div'></div>

Mar 24

js刷新页面 不指定

phpcto , 18:14 , WEB技术 » javascript , 评论(0) , 引用(0) , 阅读(1551) , Via 本站原创

<script language="JavaScript">
function myrefresh(){
window.location.reload();
}
setTimeout('myrefresh()',1000); //指定1秒刷新一次
</script>
分页: 1/9 第一页 1 2 3 4 5 6 7 8 9 下页 最后页 [ 显示模式: 摘要 | 列表 ]