JQuery笔记(一)jq的使用方法

我用的jq版本是支持pc版为主的最高1版本里最高的1.124版本

官网的链接是只有最新的3下载,我把我在官网下载的jq代码链接发出来,如下

点我获取jq代码

和js不同的是,jq开发者封装了一些方法

在js获取元素节点的方式是这样的:

document.getElementById("#div");

而在jq中的方式是这样的:

$("div")[0]

在js获取对象的方式是这样的:

document.getElementsByTagName("#div");

而在jq中的方式是这样的:

$("div")

下面我具体举个例子

 <!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
</style>
</head> <body>
<div id="jq1"></div> <script>
//alert($("div")[0]);
//通过alert可以知道$("div")[0]是一个dom元素,后面可以通过符号.来点出一些style之类的属性
$(jq1)[0].style.width = "100px";
$(jq1)[0].style.height = "100px";
$(jq1)[0].style.background = "red";
$(jq1)[0].style.position = "absolute"; //通过alert可以知道$("div")是一个jq对象,后面可以通过符号.来点出一些已经封装好的方法
</script> </body> </html>

通过以上代码,可以看到css中我是没有设置样式的,只是初始化了一下,

而我通过一段jq代码,我给id为jq1的DIV设置了一个样式

如图就显示出来了

JQuery笔记(一)jq的使用方法

所以,可以在jq中修改样式,比在CSS里面高端了一点

上一篇:JQ的ready()方法与window.onload()的区别与联系


下一篇:jquery delegate()方法 语法