————jQuery简介及DOM对象与jQuery对象之间的转换
jQuery 是继 Prototype 之后又一个优秀的 JavaScript库
jQuery 理念: 写得少, 做得多. 优势如下:
1、轻量级
2、强大的选择器
3、出色的 DOM 操作的封装
4、可靠的事件处理机制
5、完善的 Ajax
6、出色的浏览器兼容性
7、链式操作方式
//当窗体加载完毕后触发function()匿名函数
$(document).ready(function(){
alert("hello");
});
/*
理解$符含义：jQuery对象 var jQuery=window.$;
jQuery对象就是通过jQuery($()) 包装DOM对象后产生的对象
$(document) //document 是DOM对象 包装之后变成jQuery对象
DOM对象只能使用DOM的属性方法 jQuery对象只能使用jQuery的属性和方法
$(document) jQuery对象
ready()方法//jQuery对象的方法
*/
//上面的简写形式
$(function(){
alert("hello");
});
jQuery对象
jQuery 对象就是通过 jQuery ($()) 包装DOM 对象后产生的对象
jQuery 对象是 jQuery 独有的. 如果一个对象是 jQuery对象, 那么它就可以使用jQuery 里的方法: $(“#persontab”).html();
jQuery 对象无法使用 DOM 对象的任何方法, 同样 DOM 对象也不能使用 jQuery里的任何方法
约定：如果获取的是 jQuery 对象, 那么要在变量前面加上 $.
var $variable= jQuery 对象
var variable =DOM 对象
DOM对象与jQuery对象之间的转换
<body>
用户名:<input type="text" id="name"/>
</body>
$(document).ready(function(){
//根据id获取DOM对象
//varDomInput=document.getElementById("name");
//DomInput.value="小傻";
//根据id获取jQuery对象
varjQueryInput=$("#name");
jQueryInput.val("二傻");
//把DOM对象转换成jQuery对象
//var$Dinput=$(DomInput);
//$Dinput.val("三傻");
//把jQuery转换成DOM对象
//方式一
//vardInput=jQueryInput[0];
//dInput.value="四傻";
//方式二
//dInput=$jQueryInput.get(0);
//dInput.value="五傻";
});
注：jQuery的操作是在引入类库文件的前提下进行的
!-- 引入Jquery类库文件 -->
<script type="text/javascript"src="./js/jquery-1.7.1.js"></script>