Jquery学习笔记（1）

来源：互联网发布：域名报毒怎么解决编辑：程序博客网时间：2024/05/07 02:19

先举一个例子，认识一下Jquery：

<script src="js/jquery.js" type="text/javascript"></script><script type="text/javascript">//将dom对象转换成jquery对象 $(document)//ready的作用就是当页面中的dom加载完毕后执行参数中的函数$(document).ready(function(){//1、$("a")是获得a标签的对象$("a").click(function(){alert("有反应");  });});</script><body>1、使用$("a")获得a标签的Jquery对象，再使用其click方法，获得点击事件，在该事件中写了一个方法<hr /><a href="#">test1</a> <a href="#">test2</a> <a href="#">test3</a> <a href="#">test4</a> </body>

由上所述，Jquery无非就是把DOM对象转换成Jquery对象来使用，转换成Jquery对象以后，就可以使用Jquery对象里面自带的一些方法，给我们带来方便

那么，如上面所说，Jquery无非就是把DOM对象转换成Jquery对象来使用，那么Jquery对象和DOM对象之间如何互相转换呢？让我们看如下代码：

<script src="js/jquery.js" type="text/javascript"></script><script type="text/javascript">$(document).ready(function(){//2.1、 DOM对象和Jquery对象的互相转换。因为下面的P标签中有一个唯一的id="clickMe", 所以我们也可以直接用$("#clickMe")来获得该对象         //点击下面的文字将弹出该对象里面的内容  var pElement = document.getElementsByTagName("p")[0];  //获得dom对象pElement.onclick=function(){alert("这是通过DOM对象弹出来的:" + pElement.innerHTML);//DOM 是innerHTML属性         }         var pElementJquery = $(pElement);//将DOM对象转换成jquery对象pElementJquery.click(function(){         alert("这是通过jquery对象弹出来的：" + pElementJquery.html());  //Jquery是html()方法   });});</script><body><p id="clickMe" style="color:#F00; cursor:hand">点击我，弹出我！ </p></body>

DOM---->Jquery对象： $("DOM对象") DOM对象的获得方法再次就不废话了

Jquery--->DOM对象： Jquery : var cm = $("#clickMe") ---->DOM: var t = cm[0] 或者是使用jquery里面自带的方法 var t = cm.get(0)
由此可见，jquery对象其实获得是一个DOM对象的一个数组