• JQuery实践--Why JQuery


    给页面增加动态功能的工作流模式:选择一个元素或一组元素,然后以某种方式对其进行操作。

    利用原始的JavaScript完成这些任务中的任何一个,都会需要数十行代码,JQuery让这些常见的任务变得简单

    行为与结构相分离被称为“不唐突的JavaScript”,将行为与结构分离。任何嵌入在HTML页面<body>里的JavaScript表达式或语句,不管是作为HTML元素的特性,还是嵌入在页面<body>的脚本块里,都是不正确的。

      <head>

       <script type='text/javascript'>

         window.onload = function(){

                document.getElementById('xxx').onclick = function

    ...

    }

      </script>

     </head>

    不唐突的Javascript要求客户端脚本遵守某些规则,并且应用好的编码模式。

    JQuery:使得在页面编程中使用不唐突的JavaScript技巧成为简单快乐的事儿,而无需耗费大量精力写大块代码。我们将发行有效地使用jQuery,可以编写更少的代码在页面上实现更多的功能。

    JQuery重点放在从HTML页面获取元素并对其进行操作。利用jQuery,能够利用现有知识去发挥选择权的威力。

    JQuery把确保代码能跨越所有主要浏览器以一致的方式工作,摆在了高优先级的位置。

    1.JQuery包装集:

      收集一组元素:$(selector) or jQuery(selector)

      $()函数返回特别的JavaScript对象,它包含着与选择器相匹配的DOM元素的数组。该对象拥有大量预定义的有用方法,能够作用于该组元素。 称为包装器或包装集 (用扩展功能来对匹配的元素进行包装)。能够在其上用JQuery定义的方法去操作的,匹配元素的集合。

    经常作为JQuery命令引用的许多方法的显著特征是,当完成了一个操作时,它们返回相同的一组元素,提高给下一个操作。(命令链)。因为每个函数都作用在与最初的选择器相匹配的全部元素之上,所以没有必要循环遍历元素数组。

    2.实用工具函数

      还有一些必须做的事情,并不涉及DOM元素。$ 是几个通用的实用工具函数的命名空间前缀。

      文档就绪处理程序:

                    不唐突的JavaScript,行为从结构里分离出来了。因此,执行对页面元素的操作时在创建页面雨伞的文档标记之外,为了达到这个目的,在执行操作之前,要以某种方式等待,直到页面的DOM元素完全加载。window实例的onload处理程序是在整个页面加载之后执行,会受到一些限制,比如一个大的图片在加载。

    等待文档结构被完成地解析,浏览器已经把HTML转换成了DOM树,执行代码: 

     $(document).ready(function(){ code})  <===> $(function(){code})

     好处是,可以在同一个HTML文档中多次使用此技巧,并且浏览器按照函数在页面中定义的先后顺序,一一执行指定的函数。

    3.创建DOM元素

     通过给$()函数传递包含HTML标记的字符串,可以即时创建相应的DOM元素。$(“<p>dfsdf,/p>").通常,通过这种调用而创建元素层次结构之后,接着利用jQuery的一个DOM操作函数对其进行操作

    4.扩展jQuery

     通过扩展jQuery,可以利用它提供的强大的功能,特别是在元素选择方面。

       $.fn.[funcname] = function(){ return this. 包装集 }

    5.jQuery和其他库

      导致冲突的库被加载之后的任何时刻,都可以调用:jQuery.noConflict() 把$还原到非jQuery 库所定义的含义.

    回顾:

     JQuery()函数可以用于执行的任务:

  • 相关阅读:
    【转】Hibernate 配置
    【转】关于Log4j
    This project is not a myeclipse hibernate project . Assuming Hibernate 3 capabilities configuration editor
    java集合框架分析
    鸡蛋篮子与格子取数
    贪心与回溯与DP
    NP问题
    子集生成和全排列
    JDK动态代理实现原理(转)
    java类初始化/生命周期及反射及动态代理
  • 原文地址:https://www.cnblogs.com/ahMay/p/5718724.html
Copyright © 2020-2023  润新知