JS与Jquery区别
很多人对JS和JQuery很容易搞混淆，今天我们就相比学习下：
加载区别：
var myfunction(){};
JS：1.window.onload=function(){}
2.<body onload="myfunction()">
JQuery:1.$（function(){myfunction();}）; myfunction>>加载完成后需要执行函数
2.$(document).ready(function () { initfunction});
3.window.onload = function (){ initfunction }
声明变量：（js是弱类型语言，用var关键字，如果在方法内声明变量没有用var关键字，该变量为全局变量。生命周期页面关闭结束）
声明函数：
JS：1.function name(){}
2.var name=function(){}
JQuery：跟js一样
创建对象：
JS：1.person=new Object(); 添加属性 person.name='' person.age=''
2.person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"};
3.function person(name,age){this.name=name;this.age=age}(对象构造器) var father=person（‘’，‘’）； var mother=person（‘’，‘’）；
JQuery：跟js一样
获取DOM元素：
JS：（window.documnt.getElementById() 这么写也行，因为所有的浏览器跟支持dom对象）
http://blog.csdn.net/stalwartwill/article/details/26498603（链接，有详细样例）
1.document.getElementById(); 通过document，通过ID选取元素
2.document.getElementsByName（） 通过document，通过名称name选取元素
3.document.getElementsByTagName（） 通过document，通过标签名选取元素
4.document.getElementsByClassName（） 通过document，通过CSS类选取元素
5.document.querySelectorAll（） 通过document，通过CSS选择器选取元素
JQuery：（如果$符号出现冲突时，$.noConflict();可以释放$绑定 jQuery（"#id"）或者var jq=$.noConflict(); jq（"#id"））
（以下四种为JQuery操作页面元素的四种方法）
1.$(selector).text() 设置或返回所选元素的文本内容
2.$(selector).html() 设置或返回所选元素的内容（包括 HTML 标记）
3.$(selector).val() 设置或返回表单字段的值
4.$(selector).attr() 方法用于获取属性值，（一个参数为获取，两个参数为设置）
操作DOM元素：
JS： 1.innerHTML 设置或取值（document.getElementById(“one”).innerHTML（“张三”））
2.style.color=‘’；设置元素的样式
3.src=''； 设置元素的资源路径
4.href=‘’； 设置连接值
JQuery：1.$(selector).text() 设置或返回所选元素的文本内容
2.$(selector).html() 设置或返回所选元素的内容（包括 HTML 标记）
3.$(selector).val() 设置或返回表单字段的值
4.$(selector).attr() 方法用于获取属性值，（一个参数为获取，两个参数为设置）
最常见的鼠标点击：
JS：onclick
JQuery：click
循环：
共有部分：if..else do...whlie 等
JS： for...in... 可以遍历对象和数组中的每一个元素 for (x in mycars)｛｝
Jquery:foreach... $("li").each(function(){alert($(this).text()) });
遍历每一个li元素 但是用foreach函数 得到的对象为DOM对象，所以需要强转为JQuery对象才能操作，以上为例。
JQ对象和DOM对象之间的转型：
DOM转JQuery $(DOM)
JQuery转DOM 1.jQuery 对象是一个数据对象，可以通过 [index] 的方法，来得到相应的 DOM 对象。
var $v = $("#v"); //jQuery 对象
var v = $v[0]; //DOM 对象
2.jQuery 本身提供，通过.get(index) 方法得到相应的 DOM 对象
var $v = $("#v"); //jQuery 对象
var v = $v.get(0); //DOM对象 ( $v.get()[0] 也可以 )
http://www.jb51.net/article/53391.htm（链接有样例）
正则表达式：
JS：var patt1=new RegExp("e"); 创建正则表达式 三种最常见的方法 test()，exec( ，（g|i|m）)，compile() g i m 为全部、第一、区间段
JQuery：var str=/^ [u4E00-u9FA5]$/ str.test();返回值为true或false 以"^"开始 以"$"结束。
JS与Jquery区别的更多相关文章
- js javascript jquery区别和联系
javascript:简称js ,是用于客户端Web开发的一种脚本语言,常用来给HTML网页添加动态功能. jquery:基于JS语言,封装JS的原生方法功能,提供了简便的函数接口,简化了JS的操作. ...
- js和JQuery区别
this.class="btn-default btn-info"; $(this).toggleClass("btn-default btn-info"); ...
- offsetWidth、clientWidth、width、scrollWidth区别及js与jQuery获取的方式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- onload事件与ready事件的区别，原生js与jquery的区别
onload事件与ready事件分别是原生js与jquery的入口函数 原生js入口函数写法: window.onload=function(){ } jquery入口函数写法: $(document ...
- jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jquery筛选方法
jQuery---jq基础了解(语法,特性),JQ和JS的区别对比,JQ和JS相互转换,Jquery的选择器(基础选择器,层级选择器,属性选择器),Jquery的筛选器(基本筛选器,表单筛选器),Jq ...
- jQuery (js 和 jQuery 的区别)
js 和 jQuery 的区别 主要体现在Dom操作 (jq代表我找到的元素对象)找元素: js:document.get... jquery: $(选择器)设定:jq 是jquery对 ...
- JS和jQuery用法区别
目录 JS和jQuery用法区别 外观区别 查找元素 操作标签 操作内容 操作属性 操作位置 操作样式 事件 JS和jQuery用法区别 外观区别 jQuery与JS最直观的区别就是外观上jQuery ...
- 原生JS和JQuery的区别
1.原生js和jQuery的入口函数加载模式不同 原生js等页面dom加载完成并且图片等资源也加载完成之后才会执行: jQuery则是等页面dom加载完成执行,不会等图片等资源也加载完成: (也就是说 ...
- 用原生js模仿jquery
阅读声明:本文档仅供学习,由于个人能力有限,文档中有错漏的地方还请指出,大家共同学习. 目前在学习怎么样写jquery,模仿阶段,有兴趣的同学可以和我一起学习,共同交流,在学习的路上希望有你做伴. 在 ...
随机推荐
- Alljoyn之管中窥豹
Alljoyn之管中窥豹 一.历史: Alljoyn是高通2011年推出的近距离P2P通讯技术,它为分布式应用程序在不同设备中提供了运行环境,特别是移动性.安全性和动态配置,支持Microsoft W ...
- [CORS：跨域资源共享] W3C的CORS Specification
随着Web开放的程度越来越高,通过浏览器跨域获取资源的需求已经变得非常普遍.在我看来,如果Web API不能针对浏览器提供跨域资源共享的能力,它甚至就不应该被称为Web API.从另一方面来看,浏览器 ...
- C# 服务程序 - 调试服务
前言:本篇文章环境是VS2015,win10.如果有任何的差别,请注意 1. 创建服务程序 1)用VC创建服务程序,叫做 MyTestWindowsService 创建完成之后,可以看到 2)添加安装 ...
- Java 网络爬虫获取页面源代码
原博文:http://www.cnblogs.com/xudong-bupt/archive/2013/03/20/2971893.html 1.网络爬虫是一个自动提取网页的程序,它为搜索引擎从万维网 ...
- kafka 安装出现的几个问题
1.安装kafka的过程出现两个问题 1)错误: 找不到或无法加载主类 kafka.Kafka 原因: 下载的是源码包,需要编译.可以下载Binary downloads: 2) ERROR I ...
- thinkPHP入门之二
thinkphp提供了很多便利的方法,因为php要记的东西太多了,而thinkphp极大简化了这些,让编写过程更加快速. 为了预防那些了解它的人胡乱玩耍,thinkphp提供一个函数_empty 它是 ...
- Inno Steup 打包加入文件夹
在[Files]段下,添加下面代码Source: "执行文件.exe"; DestDir: "{app}"; Flags: igNoreversionSourc ...
- Web APi之过滤器创建过程原理解析【一】（十）
前言 Web API的简单流程就是从请求到执行到Action并最终作出响应,但是在这个过程有一把[筛子],那就是过滤器Filter,在从请求到Action这整个流程中使用Filter来进行相应的处理从 ...
- VS 2015 Enterprise第二大坑
前言 继上篇文章之后,你会继续跌进大坑,这个坑困扰我一上午,同时也会让你大跌眼镜,如果你遇到了,那么恭喜你提升自身能力和解决能力的时机到了,当然你可以通过本文继续少走不必要的弯路[我也是无意中发现的捷 ...
- Oracle之PL/SQL学习笔记
自己在学习Oracle是做的笔记及实验代码记录,内容挺全的,也挺详细,发篇博文分享给需要的朋友,共有1w多字的学习笔记吧.是以前做的,一直在压箱底,今天拿出来整理了一下,给大家分享,有不足之处还望大家 ...