JQ的基础

最新推荐文章于 2022-05-29 21:35:04 发布

一生一世的我

最新推荐文章于 2022-05-29 21:35:04 发布

阅读量239

点赞数

文章标签： html jquery

本文链接：https://blog.csdn.net/weixin_43679330/article/details/104712078

版权

JQ的触发

在js中，如果要在代码执行的时候运行方法，则需要在里面设置一个οnlοad=check()触发事件，一旦该代码执行的时候则会运行js中的check()方法；
但是在jq中不需要设置该触发事件，直接是$(function(){});即可
下面是jq的代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../js/jquery-1.11.3.min.js"></script>
		<script>
				$(function(){
				alert("aaaa");
			});
			
			$(function(){
				alert("bbb");
			});
		</script>
	</head>
	<body>
	</body>
</html>

下面是js的代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
			function check(){
				alert("aaa");
			}
		</script>
	</head>
	<body onload="check()">
	</body>
</html>

js对象和jq对象之间的相互转换

在某些情况下用jq比较方便，某实时候用js比较的方便，所以我们应该知道他们之间的相互转化。

1. js中想要获得对事物的控制权，
则可以用 var d1=document.getElementById(“d1”);来获取控制权

2. jq中想要获得对事物的控制权，则可以用var d1=$("#d1");来获取控制权

3. js对象转化成jq对象只需要直接在外面+美元符合+括号即可，例如$(d1);即可

**4. jq转化成js对象有两种方法

d1[0]即可
d1.get(0)即可
**
代码如下

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="../js/jquery-1.11.3.min.js" ></script>
		<script>
			window.onload=function(){
				//传统方式
				var d1=document.getElementById("d1");
			//	d1.innerHTML="<font color='blue'>js的对象</font>";
			//js转化成jq对象
			$(d1).html("js转化成jq对象");
			}

		$(function(){
			var d1=$("#d1");
			//d1.html("jq的对象");
			//还可以将jq转化成js对象
			//一种方式
			//d1[0].innerHTML="jq转化成js对象";
			//二种方式
			//d1.get(0).innerHTML="js转化成jq的第二种方式";
		});
		</script>
	</head>
	<body id="d1" style="border: 10px solid red;width: 100px;height: 100px;">
	</body>
</html>