zoukankan      html  css  js  c++  java
  • 为什么要使用jquery?

    利用jquery等库的选择器可以不再依赖于特定的ID或类名,而且可以减少很多代码,以下实例说明:

    效果:点击article标签里面的nav标签里面的a链接,弹出框“点击了连接”

    js写法:

    function linksnum(){
    var article=document.getElementsByTagName("article");
    for(var a=0;a<article.length;a++){
    var nav=article[a].getElementsByTagName("nav");
    for(var n=0;n<nav.length;n++){
    var links=nav[n].getElementsByTagName("a");
    for(var l=0;l<links.length;l++){
    links[l].onclick=function(){alert("点击了连接");return false;}
    }
    }
    }
    }
    window.onload=linksnum;

    jquery写法:

    <script src="jquery.js"></script>
    <script>
    $(function(){
    $('article nav a').click(function(){
    alert("点击了连接");return false;
    })
    })
    </script>

    把上面的两种写法分别替换下面的js部分,都可以实现同样的效果,但是代码长度却差别很大,当然,如果是那么简单的功能,通常都不会特意引用一个jquery库来写,那样得不偿失

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>利用jquery等库的选择器可以不再依赖于特定的ID或类名,而且可以减少很多代码</title>
    </head>
    <script>
    //js代码区
    </script>
    <body>
    
    <article>
    <nav><a href="1">我是连接一</a><a href="2">我是连接二</a></nav>
    </article>
    <article class="article">
    <nav><a href="#">我是连接三</a><a href="#">我是连接四</a></nav>
    </article>
    
    </body>
    
    </html>
  • 相关阅读:
    BZOJ2142: 礼物
    GYM100633J. Ceizenpok’s formula 扩展lucas模板
    Codeforces451E Devu and Flowers
    BZOJ2982: combination Lucas模板
    UVAL3700
    BZOJ2821: 作诗(Poetize)
    BZOJ2724: [Violet 6]蒲公英
    Luogu P1858 多人背包
    Luogu P2831 愤怒的小鸟(状压+记忆化搜索)
    Luogu P4205 [NOI2005]智慧珠游戏
  • 原文地址:https://www.cnblogs.com/tinyphp/p/3006052.html
Copyright © 2011-2022 走看看