• 技术文章 >web前端 >js教程

    不得不分享的JavaScript常用方法函数集(下)_javascript技巧

    2016-05-16 15:23:25原创447
    本文中,收集了一些比较常用的Javascript函数,希望对学习JS的朋友们有所帮助。

    22. 替换元素

    $(document).ready(function() {
      $('#id').replaceWith('
    
    I have been replaced
    '); });

    23. jQuery延时加载功能

    $(document).ready(function() {
      window.setTimeout(function() {
        // do something
      }, 1000);
    });
    

    24. 移除单词功能

    $(document).ready(function() {
      var el = $('#id');
      el.html(el.html().replace(/word/ig, ""));
    });
    

    25. 验证元素是否存在于jquery对象集合中

    $(document).ready(function() {
      if ($('#id').length) {
       // do something
     }
    });
    

    26. 使整个DIV可点击

    $(document).ready(function() {
      $("div").click(function(){
         //get the url from href attribute and launch the url
       window.location=$(this).find("a").attr("href"); return false;
      });// how to use
    home
    });

    27. ID与Class之间转换
    当改变Window大小时,在ID与Class之间切换

    $(document).ready(function() {
      function checkWindowSize() {
        if ( $(window).width() > 1200 ) {
        $('body').addClass('large');
      }  else {
        $('body').removeClass('large');
      }
      }
    $(window).resize(checkWindowSize);
    });
    

    28. 克隆对象

    $(document).ready(function() {
      var cloned = $('#id').clone();// how to use
    });

    29. 使元素居屏幕中间位置

    $(document).ready(function() {
     jQuery.fn.center = function () {
        this.css("position","absolute");
           this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
              this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
                 return this;
     }
     $("#id").center();
    });
    

    30. 写自己的选择器

    $(document).ready(function() {
      $.extend($.expr[':'], {
        moreThen1000px: function(a) {
             return $(a).width() > 1000;
       }
      });
     $('.box:moreThen1000px').click(function() {
        // creating a simple js alert box
       alert('The element that you have clicked is over 1000 pixels wide');
     });
    });
    

    31. 统计元素个数

    $(document).ready(function() {
      $("p").size();
    });
    

    32. 使用自己的 Bullets

    $(document).ready(function() {
      $("ul").addClass("Replaced");
      $("ul > li").prepend("‒ "); // how to use
     ul.Replaced { list-style : none; }
    });
    

    33. 引用Google主机上的Jquery类库

    //Example 1
    
    
     // Example 2:(the best and fastest way)
    
    

    34. 禁用Jquery(动画)效果

    $(document).ready(function() {
      jQuery.fx.off = true;
    });
    

    35. 与其他Javascript类库冲突解决方案

    $(document).ready(function() {
      var $jq = jQuery.noConflict();
      $jq('#id').show();
    });

    以上就是本文的全部内容,喜欢的就收藏吧!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:JavaScript 方法 函数
    上一篇:基于jquery实现图片相关操作(重绘、获取尺寸、调整大小、缩放)_jquery 下一篇:JQuery datepicker 用法详解_jquery
    大前端线上培训班

    相关文章推荐

    • innerhtml是jquery方法么• javascript怎么设置标签的背景颜色• jquery select 不可编辑怎么办• javascript 怎么将时间转毫秒• 浅谈怎么利用node提升工作效率

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网