jQuery开发入门
jQuery是JavaScript库中的优秀一员。
下载完jQuery框架文件jquery-1.9.0.js 后，不需要任何安装，仅需使用<script>文件导入标记，将该框架文件导入页面中即可。假设该文件保存在项目文件夹WebContent的子文件js中，那么，在页面的<head></head>中加入如下代码：
<script language="javascript" type="text/javascript" src="js/jquery-1.9.0.js"></script>
即可。
下面给出一个简单的jQuery程序。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title> <script language="javascript" type="text/javascript" src="js/jquery-1.9.0.js"></script> <script type="text/javascript"> //以下三者基本等价，第二个最常用
$(document).ready(function(){ //jQuery的写法
//程序段 alert("hello ");
}) $(function(){ //jQuery的写法
//程序段
}) window.onload=function(){ //JavaScript的写法
//程序段
}
</script>
</head> <body> </body>
</html>
前两个在页面框架下载完毕后就执行，而第三个必须在页面全部加载完毕后才能执行。
jQuery访问DOM对象（Document Object Model）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title> <script language="javascript" type="text/javascript" src="js/jquery-1.9.0.js"></script> <script type="text/javascript">
$(function(){
var divTmp=document.getElementById("divTmp").innerHTML;//获取DOM对象中的内容
var divTmp2=$("#divTmp").html();//获取jQuery对象中的内容 二者结果等价
})
</script> </head>
<body>
<div class="divFrame">
<div id="divTmp">测试文本</div>
</div>
</body>
</html>
即，jQuery通过 $(“#id”) 获得相应对象。
对于获取对象中的内容或文本框的值等，JavaScript和jQuery采用的方法分别如下：
JavaScript： var divTmp=document.getElementById("divTmp").innerHTML;
document.getElementById("divTip").innerHTML="hello";
var oTxtValue=document.getElementById("Text1").value;
jQuery： var divTmp2=$("#divTmp").html(); //获取页面内容
$("#divTip").html("hello"); //给页面赋予内容
var oTxtValue2=$("#Text1").val();
$("#id").val("world");
对于click函数，JavaScript和jQuery采用的方法分别如下：
JavaScript的方法：
<head>
<script language="javascript" type="text/javascript" src="js/jquery-1.9.0.js"></script> <script type="text/javascript">
function btnClick(){
//程序段
}
</script>
</head>
<body>
<input type="button" value="提交" onclick="btnClick();"/>
</body>
jQuery的方法：
<head>
<script language="javascript" type="text/javascript" src="js/jquery-1.9.0.js"></script> <script type="text/javascript">
$(function(){
$("#btnSubmit").click(function(){
//程序段
})
})
</script>
</head>
<body>
<input type="button" value="提交" id="btnSubmit"/>
</body>
jQuery开发入门的更多相关文章
- 从零开始学习jQuery (一) 入门篇
本系列文章导航 从零开始学习jQuery (一) 入门篇 一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案, 即使你会使用jQuery也能在阅读中发现些 ...
- jQuery的入门与简介
jQuery的入门与简介<思维导图> <初学者请各位高手指点指点> jQuery是继Prototype之后又一个优秀的JavaScript库,在JavaScript基础上我 ...
- jQuery UI 入门之实用实例分享
jQuery UI 入门 jQuery UI 简介 jQuery UI 是一个建立在 jQuery JavaScript 库上的小部件和交互库,您可以使用它创建高度交互的 Web 应用程序.无论您是创 ...
- jQuery UI 入门之实用实例
jQuery UI 入门 jQuery UI 简介 jQuery UI 是一个建立在 jQuery JavaScript 库上的小部件和交互库,您可以使用它创建高度交互的 Web 应用程序.无论您是创 ...
- spring boot + vue + element-ui全栈开发入门——开篇
最近经常看到很多java程序员朋友还在使用Spring 3.x,Spring MVC(struts),JSP.jQuery等这样传统技术.其实,我并不认为这些传统技术不好,而我想表达的是,技术的新旧程 ...
- 第一百九十一节，jQuery EasyUI 入门
jQuery EasyUI 入门 学习要点: 1.什么是 jQuery EasyUI 2.学习 jQuery EasyUI 的条件 3.jQuery EasyUI 的功能和优势 4.其他的 UI 插件 ...
- PHP Web开发入门流程
在学习WEB开发前,至少有一个对C或者计算机编程任何一种语言的基本学习,这会对你以后的开发有一定的启蒙作用. 一.Web开发入门 推荐学习网址: http://www.w3school.com.cn/ ...
- day 48 jQuery快速入门
jQuery快速入门 jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Ev ...
- openresty 前端开发入门五之Mysql篇
openresty 前端开发入门五之Mysql篇 这章主要演示怎么通过lua连接mysql,并根据用户输入的name从mysql获取数据,并返回给用户 操作mysql主要用到了lua-resty-my ...
随机推荐
- ToString(string format)输出格式简述
ToString说明 ToString 是 .NET Framework 中主要的格式化方法.它将对象转换为其字符串表现形式,使它适合于显示.(有关对 .NET Framework 中的格式设置支持的 ...
- ZOJ 3962 Seven Segment Display 16进制的八位数加n。求加的过程中所有的花费。显示[0,F]有相应花费。
Seven Segment Display Time Limit: Seconds Memory Limit: KB A seven segment display, or seven segment ...
- Hello JFinal World
JFinal 是基于 Java 语言的极速 WEB + ORM 开发框架,其核心设计目标是开发迅速.代码量少.学习简单.功能强大.轻量级.易扩展.Restful.在拥有Java 语言所有优势 ...
- JAVA中BufferedReader设置编码的必要性
实验环境 Myeclipse 默认编码 UTF-8 先看两种读文件的方式: 方式一: InputStreamReader fReader = new InputStreamReader(new Fil ...
- react 近期
ECMAScript 6 入门:http://es6.ruanyifeng.com/#docs/destructuring#%E6%95%B0%E7%BB%84%E7%9A%84%E8%A7%A3%E ...
- mybatis if test 相等的情况怎样动态拼接sql
今天程序须要依据前台的传过来的状态推断在数据库里是取 where a>b 还是 a<b 还是 a=0 的情况 搞了一下午最后试了下 在if 里面拼接 #{status}=#{statu ...
- 大话DFT频谱分析（并不是我的话）
有限长信号DFT结果的频谱泄露 提出问题 依照我们在"信号与系统"这门课建立的印象,不管如何频率的连续正弦信号,其频谱应当是两根笔直的谱线(含负频率) 但是,当我们把一段正弦信号採 ...
- 从设计到实现，一步步教你实现Android-Universal-ImageLoader-缓存
转载请标明出处,本文出自:chaossss的博客 Android-Universal-ImageLoader Github 地址 Cache 我们要对图片进行缓存.有两种方式:内存缓存和本地缓存. 这 ...
- jprofiler_监控远程linux服务器的JVM进程(转 非常棒)
几天前写了一篇文章,jprofiler_监控远程linux服务器的tomcat进程(实践),介绍了使用jprofiler怎样监控远程linux的tomcat进程,这两天想了想,除了可以监控tomcat ...
- Oracle Delete与系统资源
在用Delete删除数据时,SQL语句首先要通过全表扫描或索引扫描找到符合条件的记录并删除. 然而在这个过程中将消耗大量的CPU资源,I/O资源以及UNDO数据. 如果删除的数据量较大,将极大的影响系 ...