【JS】HTMLprop与attr的区别
2024-10-16 20:02:51
与prop一样attr也可以用来获取与设置元素的属性。
区别在于,对于自定义属性和选中属性的处理。
选中属性指的是 checked,selected 这2种属性
1. 对于自定义属性 attr能够获取,prop不能获取
2. 对于选中属性
attr 只能获取初始值, 无论是否变化
prop 能够访问变化后的值,并且以true|false的布尔型返回。
***注意***:attr方法,第二次添加selected属性,option不会被选中
<script src="http://how2j.cn/study/jquery.min.js"></script> <script>
$(function(){
$("#b1").click(function(){
alert("game属性是:" + $("#c").attr("game") );
}); $("#b2").click(function(){
alert("game属性是:" + $("#c").prop("game") );
}); $("#b3").click(function(){
alert("checked属性是:" + $("#c").attr("checked") );
}); $("#b4").click(function(){
alert("checked属性是:" + $("#c").prop("checked") );
}); }); </script> <style>
button{
display:block;
}
</style> <button id="b1">通过attr获取自定义属性 game</button>
<button id="b2">通过prop获取自定义属性 game</button>
<button id="b3">通过attr获取 checked属性</button>
<button id="b4">通过prop获取 checked属性</button> <br>
<br> <input type="checkbox" id="c" game="LOL" checked="checked"> 选中的复选框 <select id="ss" autocomplete="off">
<option id="op1">某位</option>
<option id="op2">女生</option>
<option id="op3">男生</option>
</select>
<div id="ssss1">add</div><div id="ssss2">remove</div>
<script src="jquery-1.12.0.min.js"></script>
<script type="text/javascript">
$("#ssss1").click(function () {
$("#op2").attr("selected",true)
$("#op2").prop("selected",true)
})
$("#ssss2").click(function () {
$("#op2").attr("selected",false)
$("#op2").prop("selected",false)
})
</script>
最新文章
- HTTPS协议机制
- win7双系统安装ubuntu并配置常用软件
- 文法 LL1
- 为什么要选择Sublime Text3?
- ubuntu显示桌面的快捷键,以及修改方法
- c++11之bind
- MSSQL删除字段时出现 服务器: 消息 5074,级别 16,状态 1,行 1 的解决办法
- linux下重启mysql php nginx
- PHP的模板引擎这点事儿
- 利用c++操作XML,主要是内部循环方法的使用
- Stm32高级定时器(四)
- WPF利用Image实现图片按钮
- WPF的重要新概念
- USACO 3.3 Camelot
- linux内核移植到S5pv210
- 跨域访问http接口的使用
- 【已解决】React中配置Sass引入.scss文件无效
- 【Unity Shaders】Reflecting Your World —— 在Unity3D中创建Cubemaps
- JSP 对象的作用范围
- windows端口并结束其进程