jQuery 动态内容添，获取HTML标签和属性

最新推荐文章于 2022-01-21 16:28:07 发布

IT难

最新推荐文章于 2022-01-21 16:28:07 发布

阅读量1.8w

点赞数

分类专栏： jQuery HTML JS 文章标签： html jquery function jquery插件 div button

本文链接：https://blog.csdn.net/fellting/article/details/7557705

版权

JS 同时被 3 个专栏收录

16 篇文章 0 订阅

订阅专栏

HTML

4 篇文章 0 订阅

订阅专栏

jQuery

3 篇文章 0 订阅

订阅专栏

在页面开发中，操作HTML比较简单，Ajax获取表单中的内容，封装数据比较简单了，假设是JSON的，key值填写ID值，value值填写标签内容值，不需要重复的选择器去选择，需要注意的是ID值要和JAVA对象里面的属性值保持一致。前后代码变得非常简单。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
			//动态内容添加
			$('#addTable').click(function(){
				var value = '<div id="div">'+$('#div').html()+'</div>';
				$('#div').after(value);
			});
			
			//获取所有DIV中的所有INPUT和select标签对象
			$('#addPro').click(function(){	
				$('body div[id=div]').each(function(){
					$(":text,:selected",this).each(function(){
						var id = $(this).attr('id');
						var value = $(this).val();
						var tagName = $(this).get(0).tagName;
						if(tagName=='INPUT'&&id!=undefined){
							   alert(id+":"+value);
						}
						if(tagName=='OPTION'){
							//要获得select的ID ，就要取得
							 var key = $(this).html();
							 alert(key);
						}
					});
					 
				});
			});
	});
</script>
</head>
<body>
	<div id="div">
		<table>
		<tr>
		<td>一个</td>
		</tr>
		<tr><td>
		<select id="ddd">
			<option value="china">中国</option>
			<option value="us">美国</option>
		</select></td></tr>
		<tr><td>
		<input id="userID" type="text"/></td></tr>
		<tr><td>
		<input id="userID1" type="text"/></td></tr>
		</table>
	</div>
	
	<div>
		<input type="button" id="addTable" value ="增加表格" />
	</div>
	<div>
		<input type="button" id="addPro" value ="提交数据表格" />
	</div>
</body>
</html>

加下jquery插件。

太阳系 - http://blog.csdn.net/fellting

IT难

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
jQuery 动态内容添，获取HTML标签和属性

在页面开发中，操作HTML比较简单，Ajax获取表单中的内容，封装数据比较简单了，假设是JSON的，key值填写ID值，value值填写标签内容值，不需要重复的选择器去选择，需要注意的是ID值要和JAVA对象里面的属性值保持一致。前后代码变得非常简单。Insert title here $(document).ready(function(){ //动态内容添加
复制链接

扫一扫