自己总结了一下JQuery底层的一些思想,纯属于个人见解。。

为了方便描述,现在客户假如给了我们一个需求:

页面上有两个按钮,一张图片,当我点击hidden按钮时隐藏图片,当我点击show按钮时显示图片。假如让你做你会如何去实现这个需求呢??

方法一:利用DOM技术去定位到按钮,当点击按钮时触发JS onclick事件进而引发一个函数,在函数中利用DOM定位图片的位置,然后修改图片的visibility属性即可。

  》》改进

方法二:方法一是可以完成,但是在操作上比较繁琐。这时候我们想起了面向对象,我们可以将页面上的图片封装起来并为该图片有两个行为,即"show"和"hidden";当点击按钮时触发JS onclick事件    进而引发一个函数,在函数中我们实例化出图片对象,调用该对象的行为("show","hidden")即可。

  》》改进

方法三:方法二对方法一进行了封装,简化了一部分代码,但是我们都是非常懒的人,还是觉得代码太长,写起来不方便,那我们该怎么办呢?对!!就是将Javascript再次进行封装,封装完之后我们只需要按照自己的规则去写代码就行了。例如$("#ID"),它的本质是一个函数,$其实只是一个方法名而已,#ID是函数的形参,这样做给了我们一个假象,就是只需要调用这个函数就能够定位到某个节点,其实归结到底层的实现,它仍然用的是一些比较传统的形式,类似于document.getElementById();document.getElementsByTagName();document.ElementsByName();

JQuery的一些思想,自己的一些见解!!!!的更多相关文章

  1. jQuery的核心思想

    jQuery?----www.jQuery.com jQuery的理念:write less, do more jQuery的成就:世界排名前100的公司,46%都在使用jQuery,远远超过其他库, ...

  2. jQuery中面向对象思想实现盒子内容切换

    这里主要是模拟小米官网中的首页的内容模块实现的主要动态效果 布局:采用了bootstrap框架进行布局,及其其中的字体图标 html: <!-- 内容 --> <div class= ...

  3. jQuery之排他思想

    使用的方法:click()    css()   siblings() <button>快速</button> <button>快速</button> ...

  4. jQuery设计思想

    jQuery设计思想 原文网址:http://jqfundamentals.com/book/ 阮一峰 翻译整理 [目录] 一.选择网页元素 二.改变结果集 三.链式操作 四.元素的操作:取值和赋值 ...

  5. JQuery系列(6) - jQuery设计思想

    jQuery是目前使用最广泛的javascript函数库. 据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库.微软公司甚至把jQuery作为他们的官方库. JQuery设计 ...

  6. Jquery源码学习(第一天)

    jQuery是面向对象的设计通过window.$ = window.jQuery = $; 向外提供接口,将$挂在window下,外部就可以使用$和jQuery $("#div1" ...

  7. jQuery基础知识总结

    1.  jQuery基本概念介绍             1.1 什么是jQuery 一个javascript库,把常用方法写到一个js文件中,需要的时候直接调用即可 学习jQuery就是学习一些方法 ...

  8. jQuery语法

    目录: 一.选择网页元素二.改变结果集三.链式操作四.元素的操作五.元素的操作:移动六.元素的操作:复制.删除和创建七.工具方法八.事件操作九.特殊效果 一.选择网页元素这也是jQuery的基本设计思 ...

  9. 精通jQuery选择器

    虽然jQuery上手简单,相比于其他库学习起来较为简单,但是要全面掌握,却不轻松.因为它涉及到网页开发的方方面面,提供的方法和内部变化有上千种之多.初学者常常感到,入门很方便,提高很困难.本文的目标是 ...

随机推荐

  1. [LeetCode] Maximum Product Subarray 连续数列最大积

    Find the contiguous subarray within an array (containing at least one number) which has the largest ...

  2. Codevs 1643 & 3027 线段覆盖

    1643 题意 给定若干条线段,问最多可以安排多少条使得没有重合. 思路 贪心,同安排schedule,按结束时间早的排序. Code #include <bits/stdc++.h> # ...

  3. Netbeans 8.2启动参数含义及配置

    在manjaro linux中Netbeans8.2 + JDK 1.8 netbeans的配置文件具体在:/usr/share/netbeans/etc/netbeans.conf,需要使用root ...

  4. python 集合比较(交集、并集,差集)

    python的set和其他语言类似, 是一个无序不重复元素集, 基本功能包括关系测试和消除重复元素. 集合对象还支持union(联合), intersection(交), difference(差)和 ...

  5. [SaltStack] Minion-conf自动更新

    minion-conf配置文件自动更新, 加载 minion-conf是每个minion自身以来的配置, 为了方便我们在中心管控机上(Master)统一配置, 然后下发文件, 进而使得Minion能够 ...

  6. git使用代理clone加速

    不设置代理10kb/s不到....,设置后,500kb/s左右跑- 开shadowsocks,代理127.0.0.1:1080 编写一个脚本 /YOUR PATH/gitproxy.sh #!/bin ...

  7. LeetCode OJ--Binary Tree Zigzag Level Order Traversal *

    https://oj.leetcode.com/problems/binary-tree-zigzag-level-order-traversal/ 树的层序遍历 使用两个 stack 或者 vect ...

  8. Nginx的简单最小安装!

    一.检查安装环境 rpm -qa gcc pcre pcre-devel zlib zlib-devel openssl pcre, 重写rewrite zlib,为了gzip压缩. gcc,c编译器 ...

  9. Educational Codeforces Round 35 B. Two Cakes【枚举/给盘子个数,两份蛋糕块数,最少需要在每个盘子放几块蛋糕保证所有蛋糕块都装下】

    B. Two Cakes time limit per test 1 second memory limit per test 256 megabytes input standard input o ...

  10. mysql日常运维与参数调优

    日常运维 DBA运维工作 日常 导数据,数据修改,表结构变更 加权限,问题处理 其它 数据库选型部署,设计,监控,备份,优化等 日常运维工作: 导数据及注意事项 数据修改及注意事项 表结构变更及注意事 ...