深入分析JQuery和JavaScript的异同


Posted in Javascript onOctober 23, 2014

ps:LZ觉得这个标题有点大了,超出了能力范围,不喜勿碰。目前只记录LZ能力范围内的,日后持续补充。

一、JQuery对象和DOM对象的相互转化(《锋利的JQuery》)

       JQuery转化为DOM:

          1、var jq = $(‘#selector');   var dom = jq[index];

          2、var jq1 = $(‘#selector1');  var dom1 = jq1.get(index) 或者 var dom1 = jq1.get()[index];

      DOM转化为JQuery:

          假设cr是一个DOM对象,转为JQuery,jqcr = $(‘cr');

二、JQuery的$(document).ready()和JavaScript的window.onload()的区别(《锋利的JQuery》)

       1、执行时机

            window.onload必须等待网页中所有资源(包括图片)加载完成后才能执行,而$(document).ready()在所有DOM结构绘制完毕后就执行,但是可能与DOM相关联的资源还没有加载完毕。

       2、编写个数

            一个文档中,window.onload只有是一个,而$(document).ready()可以有多个

       3、简化方法

           window.onload没有简写形式,$(document).ready()可以简写为$(function(){}).

 

三、JQuery和JavaScript中访问属性名称的区别(《JQuery实战》)

       JQuery规范名称                             DOM规范
       cellspacing                                    cellSpacing
       class                                                className
       colspan                                          colSpan
       cssFloat                                         IE中是styleFloat,其他浏览器是cssFloat
       float                                               IE中是styleFloat,其他浏览器是cssFloat
       for                                                  htmlFor
       frameborder                                frameBorder
       maxLength                                  maxLength
       readonly                                      readOnly
       rowspan                                       rowSpan
       stylefloat                                      IE中是styleFloat,其他浏览器是cssFloat
       tabindex                                       tabIndex
       usemap                                         useMap

四、冲突

        DOM理论上不会有冲突产生,JQuery防止冲突产生的两种解决方法:(《锋利的JQuery》)

        1、JQuery库在其他库之后导入

              调用JQuery。noConflict()方法将$控制权给其他库使用,或者自定义快捷方式,$j = JQuery.noConflict();

        2、JQuery库在其他库之前导入

               直接使用JQuery代替$工作,同时$可以作为其他库的快捷方式。

Javascript 相关文章推荐
jquery text,radio,checkbox,select操作实现代码
Jul 09 Javascript
jquery 隐藏与显示tr标签示例代码
Jun 06 Javascript
jQuery实现dialog设置focus焦点的方法
Jun 10 Javascript
AngularJS中的Directive实现延迟加载
Jan 25 Javascript
Angularjs中UI Router的使用方法
May 14 Javascript
利用vue + koa2 + mockjs模拟数据的方法教程
Nov 22 Javascript
详解Vue2.0配置mint-ui踩过的那些坑
Apr 23 Javascript
vue自定义底部导航栏Tabbar的实现代码
Sep 03 Javascript
node 版本切换的实现
Feb 02 Javascript
vue-admin-template配置快捷导航的代码(标签导航栏)
Sep 04 Javascript
详解JavaScript中分解数字的三种方法
Jan 05 Javascript
vue 数据双向绑定的实现方法
Mar 04 Vue.js
jquery实现导航固定顶部的效果仿蘑菇街
Oct 22 #Javascript
用jquery模仿的a的title属性的例子
Oct 22 #Javascript
运用jQuery定时器的原理实现banner图片切换
Oct 22 #Javascript
用简洁的jQuery方法toggleClass实现隔行换色
Oct 22 #Javascript
jQuery实现的导航条切换可显示隐藏
Oct 22 #Javascript
原生js和jQuery随意改变div属性style的名称和值
Oct 22 #Javascript
一个不错的js html页面倒计时可精确到秒
Oct 22 #Javascript
You might like
PHP判断远程url是否有效的几种方法小结
2011/10/08 PHP
Laravel 5 框架入门(三)
2015/04/09 PHP
php结合正则获取字符串中数字
2015/06/19 PHP
PHP实现留言板功能的详细代码
2017/03/25 PHP
laravel 实现设置时区的简单方法
2019/10/10 PHP
Javascript - HTML的request类
2006/07/15 Javascript
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
2012/02/10 Javascript
图片延迟加载的实现代码(模仿懒惰)
2013/03/29 Javascript
select标签模拟/美化方法采用JS外挂式插件
2013/04/01 Javascript
js设置文本框中焦点位置在最后的示例代码(简单实用)
2014/03/04 Javascript
JavaScript简介
2015/02/15 Javascript
javascript将DOM节点添加到文档的方法实例分析
2015/08/04 Javascript
JavaScript中获取Radio被选中的值
2015/11/11 Javascript
精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
2016/07/01 Javascript
微信小程序 传值取值的几种方法总结
2017/01/16 Javascript
vue.js全局API之nextTick全面解析
2017/07/07 Javascript
微信小程序仿美团城市选择
2018/06/06 Javascript
vue系列之requireJs中引入vue-router的方法
2018/07/18 Javascript
es6基础学习之解构赋值
2018/12/10 Javascript
python实现批量改文件名称的方法
2015/05/25 Python
python 编写简单网页服务器的实例
2018/06/01 Python
Python中的枚举类型示例介绍
2019/01/09 Python
详解python中的index函数用法
2019/08/06 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
python 中值滤波,椒盐去噪,图片增强实例
2019/12/18 Python
flask框架中的cookie和session使用
2021/01/31 Python
廉价连衣裙和婚纱礼服在线销售:Tbdress
2019/02/28 全球购物
意大利在线药房:shop-farmacia.it
2019/03/12 全球购物
英国蛋糕装饰用品一站式商店:Craft Company
2019/03/18 全球购物
Furla官网:意大利著名的皮革品牌
2019/08/06 全球购物
struct与class的区别
2014/02/03 面试题
精通CAD能手自荐书
2014/01/31 职场文书
瘦西湖导游词
2015/02/03 职场文书
2015年统计员个人工作总结
2015/07/23 职场文书
高中运动会广播稿
2015/08/19 职场文书
详解CSS开发过程中的20个快速提升技巧
2021/05/21 HTML / CSS