JQ1 基础

/ 0评 / 1
一.什么是jQuery
jQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一整套定义好的方法。它的作者是John Resig,于2006年创建的一个开源项目,随着越来越多开发者的加入,jQuery已经集成了JavaScript、CSS、DOM和Ajax于一体的强大功能。它可以用最少的代码,完成更多复杂而困难的功能,从而得到了开发者的青睐。
编写第一个简单的JQuery 小程序
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>我的第一个jquery 小程序</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery-1.3.2.min.js" charset="utf-8"></script>
</head>
<body>
<script>
$(document).ready(function(){
      alert("欢迎来到jquery 的世界!");
});
</script>
</body>
</html>
1.代码风格
$(function () {}); //执行一个匿名函数
$('#div'); //获取ID元素
$('#div').css('color', 'red'); //执行css样式功能函数
由于$本身就是jQuery对象的缩写形式,那么也就是说上面的三段代码也可以写成如下 形式:
jQuery(function () {});
jQuery('#div');
jQuery('#div').css('color', 'red');
$('#div').css('color', 'red').css('font-size', '50px'); //连缀
jQuery中代码注释和JavaScript是保持一致的,有两种最常用的注释:
单行使用“//...”,
多行使用“/* ... */”。
二.加载模式
window.onload = function () {}; //JavaScript等待加载
$(document).ready(function () {}); //jQuery等待加载
clipboard
三.对象互换
$(function () {
alert($);//jQuery 对象方法内部
alert($()); //jQuery 对象返回的对象,还是jQuery
alert($('#box'));//包裹ID 元素返回对象,还是jQuery
从上面三组代码我们发现:只要使用了包裹后,最终返回的都是jQuery 对象。这样的好处显而易见,就是可以连
缀处理。但有时,我们也需要返回原生的DOM 对象
, 
     var box=document.getElementById('box');
      alert(box);  //DOM对象
      alert( $(box));//jQuery 对象
     
jQuery 想要达到获取原生的DOM 对象,可以这么处理:
//get(num)取得其中一个匹配的元素。num 表示取得第几个匹配的元素的索引 
    alert($('#box').get(0)); //get(index) 转换成 DOM对象
     var box=$('#box');
     alert(box[0]);   // [index] 使用索引 转换成 DOM对象
});

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注