jQuery学习之入门

1.jQuery简介

 

jQuery是继Prototype之后又一个优秀的JavaScript库。

 

jQuery凭借简洁的语法和跨平台的兼容性,极大地简化了JavaScript开发人员遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax的操作。

 

2.配置jQuery环境

 

在<head>标签内引入jQuery库,即在<head>标签中添加类似如下的代码:

 

<script type="text/javascript" src="../resource/jquery-1.10.1.js"></script>


3.编写简单的jQuery

 

示例:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../resource/jquery-1.10.1.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		alert("hello world.");
	});
</script>
<title>First jQuery Test</title>
</head>
<body>
First jQuery Test.
</body>
</html>


注:在jQuery库中,$就是jQuery的一个简写形式,例如:$("#foo")和jQuery("#foo")是等价的。

 

4.jQuery对象和DOM对象

 

(1).jQuery对象

  jQuery对象是通过jQuery包装DOM对象后产生的对象。

 

(2).DOM对象(Document Object Model ,文档对象模型)

 

var domObj = document.getElementById("id");//获取DOM对象


(3).jQuery对象转成DOM对象

 

方法一:jQuery对象是一个数组对象,可以通过[index]的方法得到相应的DOM对象

 

var $cr = $("#cr");	//jQuery对象
var cr = $cr[0];	//DOM对象


方法二:通过get(index)方法得到相应的DOM对象

 

var $cr = $("#cr");	//jQuery对象
var cr = $cr.get(0);	//DOM对象


(4).DOM对象转成jQuery对象

 

var cr = document.getElementById("cr");	//DOM对象
var $cr = $(cr);	//jQuery对象



 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值