jquery操作表格

最新推荐文章于 2024-12-24 08:45:00 发布

原创

最新推荐文章于 2024-12-24 08:45:00 发布 · 506 阅读

本文介绍了如何使用jQuery库进行高效的HTML表格操作，包括增删改查元素、动态加载数据以及实现交互式功能。通过实例代码，读者可以掌握jQuery在表格处理上的核心方法。

<html>
	<head>
		<title>jQuery操作表格</title>
		<meta charset="UTF-8"/>
		<!--声明css代码域-->
		<style type="text/css">
			tr{
				height: 40px;
			}
		</style>
		<!--
			jquery操作表格知识点总结：
				1、元素对象名.parent()//返回直接上级对象
				2、元素对象名.prev()//返回上一个紧跟的同胞元素对象
				3、this代表当前HTML元素对象---$(this)
				4、元素对象名.parents("元素名")//获取指定的祖先元素对象
				5、元素对象名.prop("属性名")//返回当前元素指定属性的值
				6、元素对象名.prop("属性名","新的值")//返回当前元素指定属性的值
				7、元素对象名.each(fn)//遍历元素对象，并给没个元素对象执行一次指定的函数。
		-->
		<!--引入jQuery文件-->
		<script src="js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				//修改数量
					$("input[value='修改数量']").click(function(){
						//获取数量所在的单元格对象
						var td=$(this).parent().prev();
						//修改单元格为文本框
						if(!isNaN(td.html())){
							td.html("<input type='text' name='count' value='"+td.html()+"' onblur='updateCount(th