跟我来学jQuery(一)

最新推荐文章于 2022-11-29 13:58:04 发布

我是为仔

最新推荐文章于 2022-11-29 13:58:04 发布

阅读量463

点赞数

本文链接：https://blog.csdn.net/liuwei_nciae/article/details/8373374

版权

一、环境配置

1、从jquery官网下载jquery.js如果这个找不到就不用学了。

2、在普通的html文件引入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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>.</title>
<!---引入jquery包 -->
<script type="text/javascript" src="jQuery.js"></script>
</head>
<body>
</body>
</html>

3、接下来我们编写一个helloWord

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>.</title>
<!---引入jquery包 -->
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
//在这里进行jquery的测试 $符号是jQuery的简写形式
    $(document).ready(function(){//等待dom元素加载完毕，自认为是和extjs的 Ext.onready()是相同的	
	    alert("hello jquery ！！！");	
	
	})

</script>
</head>
<body>
</body>
</html>

显示如下结果，我们只是alert一个弹出框，很简单

二、基本语法
1、DOM对象和jQuery对象简介

第一次学习jQuery，经常分不清哪些是jQuery对象，哪些是DOM对象，，因此需要重新了解下这两者对象及它们之间的关系。

1）DOM对象：每一个dom对象都可以表示成一棵树，下面来构建一个基本的网页，网页代码如下：

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>dom</title>
</head>
<body>
 <h3>dom例子</h3>
 <p title="选择你最喜欢的水果">你最喜欢的水果是什么？</p>
 <ul>
         <li>鸭梨</li>
	 <li>苹果</li>
	 <li>香蕉</li>
	 <li>西瓜 </li>
	 <li>菠萝</li>
  </ul>
</body>
</html>

我们可以通过js中的的getElementByTagName或者getElementById来获取元素的节点。这样得到的DOM 元素就是DOM对象，例如：

var domObj=document.getElementById("id");

var ObjHTML=domObj.innerHTML;

2)jQuery对象：其实就是通过jQuery包装DOM对象后产生的对象，是jQuery特有的，如果一个对象时jQuery对象，那么就可以用到jQuery里面。

2、jQuery对象和DOM 对象的相互转换

注意：如果获取的是jQuery对象，那么需要在变量前面加上$,例如：

var $variable=jQuery对象；

如果获取的是DOM对象：

var dom=dom对象；

我是为仔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
跟我来学jQuery(一)

一、环境配置1、从jquery官网下载jquery.js如果这个找不到就不用学了。2、在普通的html文件引入jQuery环境，如下所示：.3、接下来我们编写一个helloWord.//在这里进行jquery的测试 $符号是jQuery的简写形式 $(document).ready(function(){//等待d
复制链接

扫一扫