zoukankan      html  css  js  c++  java
  • 自己封装的js工具

     1 // 封装函数insertAfter;功能类似insertBefore();
     2 
     3 var div = document.getElementsByTagName("div")[0];
     4 var span = document.createElement("span");
     5 var a = document.getElementsByTagName("a")[0];
     6 div.appendChild(span);
     7 
     8 HTMLElement.prototype.insertAfter = function(tag, now){
     9     if(now.nextSibling.nextSibling){
    10         this.insertBefore(tag, now.nextSibling.nextSibling)
    11     }else{
    12         this.appendChild(tag)
    13     }
    14 
    15 };
    16 div.insertAfter(span, a);
    17 
    18 // 将目标节点内节点反转
    19 
    20 var div = document.getElementsByTagName("div")[0];
    21 HTMLElement.prototype.reverse = function () {
    22     var len = this.children.length;
    23     console.log(len);
    24     while(len){
    25         this.insertBefore(this.lastChild,this.firstChild);
    26         len --;
    27     }
    28 }
    29 div.reverse()
    30 
    31 // 获取窗口滚动条的兼容性方法
    32 function getScrollOffset() {
    33     if(window.pageXOffset){
    34         return {
    35             x : window.pageXOffset,
    36             y : window.pageYOffset
    37         }
    38     }else{
    39         return {
    40             x : document.body.scrollLeft + document.documentElement.scrollLeft,
    41             x : document.body.scrollTop + document.documentElement.scrollTop,
    42 
    43         }
    44     }
    45 }
    46 
    47 // 获取窗口尺寸的兼容性方法
    48 function getViewportOffset() {
    49     if(window.innerWidth){
    50         return {
    51             w : window.innerWidth,
    52             w : window.innerHeight
    53         }
    54     }else{
    55         if(documen.compatMode === "BackCompat"){
    56             return {
    57                 w : document.body.clientWidth,
    58                 h : document.body.clientHeight
    59             }
    60         }else {
    61             return {
    62                 w : document.documentElement.clientWidth,
    63                 h : document.documentElement.clientHeight
    64             }
    65         }
    66     }
    67 }
    68 
    69 //时间处理函数
    70 
    71 function addEvent(elem, type, handle){//第一个标签,第二个类型,第三个函数
    72     if(elem.addEventListener){
    73         elem.addEventListener(type,handle,false);
    74     }else if(elem.attachEvent){
    75         elem.attachEvent("on" + type, function () {
    76             handle.call(elem);
    77         })
    78     }else{
    79         elem["on" + type] = handle;
    80     }
    81 }
    Tools
    1         // 封装兼容性获取样式
    2         function getComputedStyle(elem,prop){
    3             if (window.getComputedStyle){
    4                 return window.getComputedStyle(elem,null)[prop];
    5             }else{
    6                 return elem.currentStyle[prop];
    7             }
    8         }
    封装兼容性获取样式
     1     <script 描述="兼容性异步加载最终方式">
     2         function loadScript(url, callback){
     3             var script = document.createElement("script")
     4             script.type = "text/javascript";
     5             if (script.readyState){
     6                 script.onreadystatechange = function () {
     7                     if (script.readyState == "complete" || script.readyState == "loadded"){
     8                         //IE9以下的兼容
     9                         tools[callback]();//需要工具包js配合
    10                         // eval(callback);//eval 最好不要使用
    11                     }
    12                 }
    13             }else{
    14                 //Safari chrome firefox opera 的兼容
    15                 script.onload = function () {
    16                     tools[callback]();//需要工具包js配合
    17                     // eval(callback);//eval 最好不要使用
    18                 }
    19             }
    20             script.src = url;
    21             document.head.appendChild(script);
    22         }
    23         // 异步执行js包里面的函数,按需执行,也可以修改成return信号,确定是否加载完毕等功能
    24         // loadScript(js包链接,执行的函数)
    25         // 1.defer 异步加载,但要等到dom文档全部解析完才会被执行。只有IE能用,也可以将代码写到内部。
    26         // 2.aysnc 异步加载,加载完就执行,async只能加载啊我i不脚本,不能把js写在script标签里,w3c标准,IE9以及其他主流浏览器都可以用
    27     </script>
    兼容性异步加载最终方式
  • 相关阅读:
    数据库的范式
    数据库的事务
    cookie和session以及区别
    Java交换排序:冒泡排序和快速排序
    Java面向对象中:方法重载和方法重写以及区别、 this关键字和super关键字以及区别
    电子设备产品可靠性测试
    软件测试思考笔记(The beauty of software testing)
    常见软件系统架构解决方案
    常见计算机系统架构
    性能测试
  • 原文地址:https://www.cnblogs.com/GhostCatcg/p/9470544.html
Copyright © 2011-2022 走看看