本文摘自PHP中文网,作者coldplay.xixi,侵删。
jquery和javascript的区别:1、js是通过【<script>】标签插入HTML页面,而JQuery是JavaScript函数库;2、js使用getElement系列,而JQuery使用【$()】包裹选择器。
本教程操作环境:windows7系统、javascript1.8.5版,DELL G3电脑。
jquery和javascript的区别:
一、本质上的区别
1.JavaScript 是通过<script></script>标签插入到HTML页面,可由所有的现代浏览器执行的一种轻量级的编程语言。
2.JQuery是一个JavaScript函数库。或者说是JavaScript中最流行的一种框架。
使用JQuery首先要在 HTML 代码最前面加上对 jQuery 库的引用,比如:
1 | <script src= "js/jquery.min.js" ></script>
|
库文件既可以放在本地,也可以直接使用知名公司的 CDN,好处是这些大公司的 CDN 比较流行,用户访问你网站之前很可能在访问别的网站时已经缓存在浏览器中了,所以能加快网站的打开速度。另外一个好处是显而易见的,节省了网站的流量带宽。例如:
1 | <script src= "http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" ></script> //Google
|
或者:
1 | <script src= "http://code.jquery.com/jquery-1.6.min.js" ></script> //jQuery 官方
|
二、语法上的差异
操作元素节点
a.JavaScript使用
getElement系列、query系列
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <body>
<ul>
<li id= "first" >哈哈</li>
<li class = "cls" name = "na" >啦啦</li>
<li class = "cls" >呵呵</li>
<li name = "na" >嘿嘿</li>
</ul>
<div id= "div" >
<ul>
<li class = "cls" >呵呵</li>
<li>嘿嘿</li>
</ul>
</div>
</body>
<script>
document.getElementById( "first" );
document.getElementsByClassName( "cls" );
document.getElementsByName( "na" );
document.getElementsByTagName( "li" );
document.querySelector( "#div" );
document.querySelectorAll( "#div li" );
</script>
|
b.JQuery使用
大量的选择器同时使用$()包裹选择器
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <body>
<ul>
<li id= "first" >哈哈</li>
<li class = "cls" name = "na" >啦啦</li>
<li class = "cls" >呵呵</li>
<li name = "na" >嘿嘿</li>
</ul>
<div id= "div" >
<ul>
<li class = "cls" >呵呵</li>
<li>嘿嘿</li>
</ul>
</div>
</body>
<script src= "http://code.jquery.com/jquery-1.6.min.js" ></script>
<script>
$( "#first" );
$( ".cls" );
$( "li type[name='na']" );
$( "li" );
$( "#div" );
$( "#div li" );
</script>
|
相关免费学习推荐:javascript学习教程
以上就是jquery和javascript的区别有哪些的详细内容,更多文章请关注木庄网络博客!
相关阅读 >>
popper.js怎么下载
vue框架是什么
分享6款实用的时钟特效(收藏)
怎么遍历dom
javascript怎么更改title标题
javascript中string乱码怎么办
js怎么删除数组中指定元素?
jQuery怎么删除css某个style
javascript怎么设置不可编辑
javascript如何输入数据
更多相关阅读请进入《jQuery》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » jquery和javascript的区别有哪些