javascript 和 jquery 语法上的一些区别
jQuery 能大大简化 Javascript 程序的编写,我最近花时间了解了一下 jQuery,把我上手过程中的笔记和大家分享出来,希望对大家有所帮助。
要使用 jQuery,首先要在 HTML 代码最前面加上对 jQuery 库的引用,比如:
- <script language="javascript" src="/js/jquery.min.js"></script>
库文件既可以放在本地,也可以直接使用知名公司的 CDN,好处是这些大公司的 CDN 比较流行,用户访问你网站之前很可能在访问别的网站时已经缓存在浏览器中了,所以能加快网站的打开速度。另外一个好处是显而易见的,节省了网站的流量带宽。
Google 提供的http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js
jQuery 官方的http://code.jquery.com/jquery-1.6.min.js
jQuery 代码具体的写法和原生的 Javascript 写法在执行常见操作时的区别如下:
1 定位元素
- // JS
- document.getElementById("abc")
- // jQuery
- $("#abc") //通过id定位
- $(".abc") //通过class定位
- $("div") //通过标签定位
2 改变元素的内容
- // JS
- abc.innerHTML = "test";
- // jQuery
- abc.html("test");
3 显示隐藏元素
- // JS
- abc.style.display = "none";
- abc.style.display = "block";
- // jQuery
- abc.hide();
- abc.show();
- abc.toggle(); //在显示和隐藏之间切换
4 获得焦点
- // JS和jQuery是一样的
- abc.focus();
5 为表单赋值
- // JS
- abc.value = "test";
- // jQuery
- abc.val("test");
6 获得表单的值
- // JS
- alert(abc.value);
- // jQuery
- alert(abc.val());
7 设置元素不可用
- // JS
- abc.disabled = true;
- // jQuery
- abc.attr("disabled", true);
8 修改元素样式
- // JS
- abc.style.fontSize=size;
- // jQuery
- abc.css('font-size', 20);
- // JS
- abc.className="test";
- // JQuery
- abc.removeClass();
- abc.addClass("test");
9 Ajax
- // JS
- 自己创建对象,自己处理浏览器兼容等乱七八糟的问题,略去不表
- // jQuery
- $.get("abc.php?a=1&b=2", recall);
- postvalue = "a=b&c=d&abc=123";
- $.post("abc.php", postvalue, recall);
- function recall(result) {
- alert(result);
- //如果返回的是json,则如下处理
- //result = eval('(' + result + ')');
- //alert(result);
- }
10 判断复选框是否选中
- // jQuery
- if(abc.attr("checked") == "checked")
javascript 和 jquery 语法上的一些区别的更多相关文章
- Javascript和Jquery语法对比总结
目的 相信大家都知道jq是js的一个类库,是为了方便我们开发前端,但是笔者在刚开始学习js和jq时经常将两者的语法记混和混用,所以整理下两者实现相同功能之前的语法区别. 声明变量 javascript ...
- JavaScript、Jquery选择题
尚学堂Java EE软件工程师认证考试 试题库-选择题 一. 选择题(包括单选和双选) 1.B 在JavaScript中,以下变量命名非法的是( )(选择一项) A. numb_1 ...
- 使用javaScript和JQuery制作经典面试题:光棒效果
使用javaScript与jQuery添加CSS样式的区别和步骤 使用javaScript制作光棒效果 --首先是javaScript <script> $(function () { v ...
- JavaScript和JQuery的区别
一.本质上的区别 1.JavaScript 是通过<script></script>标签插入到HTML页面,可由所有的现代浏览器执行的一种轻量级的编程语言. 2.JQuery是 ...
- 前端笔记之jQuery(上)加载函数的区别&对象&操作HTML/CSS&动画&选择器
一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...
- Web前端学习笔记之JavaScript、jQuery、AJAX、JSON的区别
官网的英文解释: javascript和jQuery有点关系,js是一种脚本语言,主要用于客户端,现在主要用于实现一些网页效果. jquery是js的一个库,你可以认为是对js的补充,提供了很多方便易 ...
- Python和JavaScript在使用上有什么区别?
转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 原文出处:https://www.freecodecamp.org/news/python-vs-javas ...
- Jquery 复习练习(02)Javascript 与jquery 互转 onclick 与click区别
Javascript 与jquery 互转 jquery 为<script src="jquery-1.8.3.js"></script> 以checkbo ...
- JQuery语法 JQuery对象与原生对象互转 文档就绪函数与window.onload的区别
[JQuery语法] 1.jQuery("选择器").action();通过选择器调用事件函数,但是jquery中,jquery可以用$(“选择器”).action(); ① ...
随机推荐
- bzoj3091
最近屯题都忘了把解题报告写上了这道题是一道比较烦的LCT,我们先考虑每个点上到底要维护什么我们设路径上有n个点,从起点到终点编号为1~n显然期望=S/[(n+1)n div 2]S=∑a[i]*i*( ...
- UVA_393_Doors_(计算几何基础+最短路)
描述 https://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&category=5&page ...
- Delphi TcxTreeList 怎么设置分组
Delphi 的TcxTreeList控件设置按种类分组,操作如下: 1. 在TcxTreeList控件中双击,打开 Bands 属性,在这里面建需要分的组,在Captions->Text 输入 ...
- 在Raspberry配置优化安装LNMP环境总结
在Raspberry配置优化安装LNMP环境总结 apt-get update apt-get install nginx apt-get install php5-fpm php5-cli php5 ...
- windows下Qt5.1 for android开发环境配置(PS:Qt5.2出来了哈,稳定)
说明:以下开发环境配置过程参考了这些文章: http://qt-project.org/wiki/building_qt-android_on_windows http://www.hyarm.com ...
- JavaScript高级程序设计39.pdf
第13章 事件 JavaScript与HTML之间的交互式通过事件来实现的. 事件流 事件流描述的是从页面中接收事件的顺序,IE和Netscape提出了完全相反的事件流概念,IE是事件冒泡流,Nets ...
- Bzoj 3236: [Ahoi2013]作业 莫队,分块
3236: [Ahoi2013]作业 Time Limit: 100 Sec Memory Limit: 512 MBSubmit: 1113 Solved: 428[Submit][Status ...
- Device Tree常用方法解析
Device Tree常用方法解析 Device Tree在Linux内核驱动中的使用源于2011年3月17日Linus Torvalds在ARM Linux邮件列表中的一封邮件,他宣称“this w ...
- WPP
WPP(Wavefront Parallel Processing) 上一行的第二个LCU处理完毕,即对当前行的第一个LCU的熵编码(CABAC)概率状态参数进行初始化,如图5所示.因此,只需要上一行 ...
- Does anyone successfully use USB drive in Windows7 guest?
Hi, Does anyone successfully use USB drive in Windows7 guest? If I pass a USB drive to Windows7 gues ...