• js 中整理(一)


    一、 冒泡与冒泡阻止

     
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
           var arr={5,0,-56,900,12,9000,-123};
           var  flag=false;
    //大的排序次数(arr.length-1)
          for(var i=0; i<arr.length-1; i++){
                for(var j=0; j<arr.length-1-i;  j++){
                     if(arr[j] >arr[j+1]){
                          //交换
                         var temp=arr[j];
                         arr[j]=arr[j+1];
                         arr[j+1]=temp;
                         flag=true;
                  }
           }
       
          if (flag){
                   flag=false;
           }else{
            break;
       }
    }

      每次都排出最末位最小的。

     
     
    以上实现的是从大到小的排序
     
    事件捕获阶段:事件从最上一级标签开始往下查找,直到捕获到事件目标(target)。
    事件冒泡阶段:事件从事件目标(target)开始,往上冒泡直到页面的最上一级标签。
     
     
     
    假设一个元素div,它有一个下级元素p。
    <div>
      <p>元素</p>
    </div>
    这两个元素都绑定了click事件,如果用户点击了p,它在div和p上都触发了click事件,那这两个事件处理程序哪个先执行呢?事件顺序是什么?
     
    两种模型
    以前,Netscape和Microsoft是不同的实现方式。
     
    Netscape中,div先触发,这就叫做事件捕获。
     
    Microsoft中,p先触发,这就叫做事件冒泡。
     
     
     
     

    ele.addEventListener('click',doSomething2,true)

    true=捕获

    false=冒泡

     
     
     
     
     
     
    最佳的阻止冒泡的方法:
     
    1、event.stopPropagation();阻止
    2、event.target == event.currentTarget(); 
     
     比较:
      从事件传递上看:方法一在于取消事件冒泡,即当某些节点取消冒泡后,事件不会再传递;方法二在于不阻止冒泡,过滤需要处理的事件,事件处理后还会继续传递;
     
     
    比较完善的方法:
    复制代码
        window.onload = function() {  
            document.getElementById("body").addEventListener("click",eventPerformed);  
        }  
        function eventPerformed(event) {  
            var target = event.target;  
            switch (target.id) {  
            case "span":   
                alert("您好,我是span。");  
                break;  
            case "div1":  
                alert("您好,我是第二层div。");  
                break;  
            case "div2":  
                 alert("您好,我是最外层div。");  
                break;  
            }  
        }  
    复制代码
     
    二、闭包
      闭包的几种写法:
    1、通过prototype原型,给函数增加一个新的属性,从而调用函数内部的变量;(常见)
    2、声明一个变量,将函数当作值赋给变量,然后返回出这个变量,从而实例化这个对象,然后进行调用;(常见)
    3、new一个新的对象,然后给对象条件添加属性与方法;
    4、var obj = {}就是声明一个空的对象;
     闭包的特点:
      1. 作为一个函数变量的一个引用,当函数返回时,其处于激活状态。
      2. 一个闭包就是当一个函数返回时,一个没有释放资源的栈区。
      简单的说,Javascript允许使用内部函数---即函数定义和函数表达式位于另一个函数的函数体内。而且,这些内部函数可以访问它们所在的外部函数中声明的所有局部变量、参数和声明的其他内部函数。当其中一个这样的内部函数在包含它们的外部函数之外被调用时,就会形成闭包。
     
     
     
     
     
     
    三、跨域
    跨域是浏览器的一种安全限制。存在跨域的几种情况:
    1、基于同一父域的子域之间,如:a.c.com 和 b.c.com
    2、基于不同的父域之前,如:www.a.com 和 www.b.com
    3、端口的不同,如:www.a.com:8080 和www.a.com:8081
    4、协议不同, 如:http://www.a.com 和 https://www.a.com
    以上四种情况可以通过后台的proxy 来解决。
     
    常见的方法:jsonp
    1、动态创建script: 
      a、在发起方页面动态加载一个script,script的URL指向接收方的一个处理地址(后台),该地址返回的javascript方法会被执行,另外URL中可以传入一些参数,该方法只支持GET方式提交参数。 
      b、加载的script可以在调用跨域js方法后再做一些自己的处理 
     
     
     $.getJSON方法会自动判断是否跨域,不跨域的话,就调用普通的ajax方法;跨域的话,则会以异步加载js文件的形式来调用jsonp的回调函数。
     
     
    http://www.jb51.net/article/31153.htm
     
     
    四、ajax
      一般格式:
    复制代码
    $.ajax({
                       url: "http://www.hzhuti.com",    //请求的url地址
                       dataType: "json",   //返回格式为json
                       async: true, //请求是否异步,默认为异步,这也是ajax重要特性
                       data: { "id": "value" },    //参数值
                      type: "GET",   //请求方式
                      beforeSend: function() {
                          //请求前的处理
                      },
                      success: function(req) {
                          //请求成功时处理
                      },
                      complete: function() {
                          //请求完成的处理
                      },
                      error: function() {
                          //请求出错处理
                      }
            });
    复制代码
  • 相关阅读:
    20145总结
    2014515 总结
    2014514 总结
    20148总结
    20147总结
    20146总结
    20149总结
    2014512 总结
    2014513 总结
    【Visual Lisp】驱动器、目录、文件和注册表
  • 原文地址:https://www.cnblogs.com/zk666/p/6840908.html
Copyright © 2020-2023  润新知