Blogger Information
Blog 87
fans 0
comment 0
visits 59375
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
第十五节课作业:2.元素固有属性的操作:prop()和removeProp()
黄忠倚的博客
Original
606 people have browsed it

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>2.元素固有属性的操作:prop()和removeProp()</title>
</head>
<body>
	<img src="./images/fbb.jpg" width="200" alt="美女" title="明星" id="pic" data-nation="中国">
	
	<script type="text/javascript" src="./js/jquery-3.3.1.js"></script>
	<script type="text/javascript">
	 // 1.prop():仅能获取元素的固有属性
	 // 获取固有属性alt,title
		var res = $('#pic').prop('alt')
		var res = $('#pic').prop('title')

		//获取自定义属性data-nation,返回underfined,获取不到
		var res = $('#pic').prop('data-nation')

		//但是如何使用prop()进行动态设置自定义属性后,就可以正常获取到?
		var res = $('#pic').prop('data-nation','中国山东')

		//此时查看元素,发现自定义属性并未发生变化,所以这种设置对元素无影响
		//此时再次查看到的自定义属性值,只是存在于当前脚本的一个临时问题
		var res = $('#pic').prop('data-nation')

		//2.removeProp()
		//
		//这个方法与removeAttr()有二点不同:
		//a,不支持空格分隔的属性列表字符串,记一次只能删除一个属性
		//b,它不能删除原生属性,如果真要删除,只要将值设为false即可
		//
		//不能同时移除多个属性,所以此条语句无效
		var res = $('#pic').removeProp('alt data-nation')
		//
		//删除原生固有的属性值alt,删除失败
		var res = $('#pic').removeProp('alt')
		//
		//用removeAttr()删除原生主题alt,删除成功
		var res = $('#pic').removeAttr('alt')
		//
		//所以,如果要用removeProp()删除原生属性,大多情况下将值设置为flase即可
		//最终由用户脚本自行处理
		var res = $('#pic').prop('alt',false)
		var res = $('#pic').prop('alt')
		
		//控制台查询结果
		console.log(res)
	</script>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

作业地址:http://mi-888.com/PHP/zuoye/20180404/2.html

Correction status:Uncorrected

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post