jquery操作元素内容

xiaojiucai 期权知识 2020-08-18 419 0

处理元素内容

　　1、text方法

　　使用说明：

　　　　1）不传参数

　　　　得到jQuery对象内所有元素及其后代元素的文本内容

　　　　2）传入用于设置匹配元素的文本内容

　　　　3）传入function

　　　　使用函数来设置jQuery对象中每个元素的文本

　　　　两个参数：第一个表示当前元素序号，第二个参数表示当前元素的文本

　　　　函数内部this代表当前的html元素对象

　　　　返回要设置的内容

　　2、html方法

　　取得第一个匹配元素的html内容或设置元素的html内容

　　使用方式同上

直接上代码：

这个是jquery的版本（jquery-1.11.3.min.js），jquery文件自已去下载

<!DOCTYPE html>    
<html>    
	<head>    
		<meta charset="UTF-8">    
		<title></title>    
		<script src="../js/jquery-1.11.3.min.js" type="text/javascript"></script>    
		<script type="text/javascript">    
			$(function(){    
				$('#btn').click(function(){    
//					html()跟js的innerHTM一样都是获得元素中所有内容    
//					var con = $('#title').html();    
//					alert(con);    
//					设置元素内容    
//					$('#title').html('新设置的内容');    
//					获得元素的纯文本内容    
//					var con = $('#title').text();    
//					alert(con);    
//					设置元素内容的纯文本内容    
					$('#title').text('哈哈哈，新设置的');    
				})    
			})    
		</script>    
	</head>    
	<body>    
		<input type="button" name="btn" id="btn" value="按钮" />    
		<h1 id="title">电影和<span>优酷</span>电视剧好看</h1>    
	</body>    
</html>

上面代码效果图片：