1.4.3: jQuery对象和DOM对象实例研究

最新推荐文章于 2025-05-09 00:35:17 发布

原创最新推荐文章于 2025-05-09 00:35:17 发布 · 828 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#checked #is

本文通过两个实例对比了DOM对象和jQuery对象在处理页面元素时的区别。第一个实例使用DOM对象来实现对复选框状态的判断，第二个实例则利用jQuery简化了这一过程。通过对这两种方法的具体展示，读者可以更好地理解它们之间的不同之处。

1. DOM对象实例研究：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script src="jQuery/jquery-1.10.2.js"></script>
<script type="text/javascript">
		$(document).ready(function(){      //等待dom元素加载完毕
			var $cb=$("#cb");              //jQuery对象
			var cb=$cb[0];                 //DOM对象
			$cb.click(function(){
				if(cb.checked){            //DOM方式判断
					alert("感谢你的支持，你可以继续操作!");
				}
			})
		});
</script>
<body>
	<input type="checkbox" id="cb"><label for="cb">同意并接受注册协议</label>
</body>
</html>

2. jQuery对象实例研究：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script src="jQuery/jquery-1.10.2.js"></script>
<script type="text/javascript">
		$(document).ready(function(){      //等待dom元素加载完毕
			var $cb=$("#cb");              //jQuery对象
			$cb.click(function(){
				if($cb.is(":checked")){            //jQuery方式判断
					alert("感谢你的支持，你可以继续操作!");
				}
			})
		});
</script>
<body>
	<input type="checkbox" id="cb"><label for="cb">同意并接受注册协议</label>
</body>
</html>