• 几条经验让jQuery用的更漂亮


      新手使用jQuery写代码时往往侧重实现功能,功能逻辑不太复杂的页面也不会太考虑性能问题,随着对jQuery的亲切问候,发现jQuery越来越简单,越是简单越是想把它用漂亮。下面总结几条常见常用又是又是经常忽略的小经验,有几条是明明知道确是看了别人的文章才发现自己常用的是糟糕的方法。

    1、在</body>前引用jQuery后无需再用$(function(){})去等待DOM结构的加载了。

    2、$('.class')效率是最低的,可以添加条件使用find()方法

    $('#id').find('.class')

    3、ID选择符是唯一的,避免使用多个ID选择符。

    4、避免使用隐式通配符

    $('.class :radio')//不建议
    $('.class input:radio')//建议

    5、为选择器指定上下文

    $('.class #id')//限定搜索范围,性能高于$('.class')

    6*、超过一次用到的jQuery 可考虑缓存来提高性能 $element表明jquery对象

    $element = $('#element');
    h = $element.height();
    $element.css('height',h+5);

    7*、正确使用时间委托

    html

    <ul id="list">
        <li>234</li>
        <li>234</li>
        <li>234</li>
        <li>234</li>
    </ul>

    相比

    $('#list').find('li').on('click',function(){
        console.log(23);
    })

    这个

    $('#list').on('click','li',function(){
        console.log(23);
    })

    性能要高很多,学习使用这种方法。

    8、采用链式操作。

    9、链式操作维持代码的可读性

    $('#id')
        .on('click',function(){ alert('hello everybody');})
        .fadeIn('slow')
        .animate({height:'120px'},500);

    好了,简单总结这几个,后续加油!

    码农随笔防失忆,只为记录风雨路上的脚丫印印~
  • 相关阅读:
    linux yum命令实践(二)
    linux的yum命令实践
    svn代码回滚命令
    Java连接mysql示例代码
    精品验证码
    稳定性测试,需要对EPC或DIC任务进行翻倍操作,供后续使用
    读取csv
    设置启动参数:禁用密码保存
    gridview超链接列链接方法 (转贴)
    gridview 跨行 跨列(原创)
  • 原文地址:https://www.cnblogs.com/bella-lin/p/8085973.html
Copyright © 2020-2023  润新知