Jquery操作属性的方法总结
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jq操作属性的方法</title>
<script type="text/javascript" src="../jquery/jquery-3.3.1.min.js"></script>
<style type="text/css">
.box{color:red;}
.mian{font-size:40px;font-weight: bold;}
</style>
<script type="text/javascript">
/* jquery的操作熟悉其原理还是对于DOM的操作
通过对象的关系，对节点数中的元素的属性进行操作的方法有以下：
addClass() 该方法想被选中的元素添加 个或者多个类
removeClass() 该方法从被选中的元素移除 个或者多个类
attr() 该方法设置或者返回被选中元素的属性值
removeAttr() 该方法从被选中的元素中移除属性
hasClass() 该方法检查被选中的元素是否包含指定class
toggleClass() 该方法被选中元素进行添加删除类的切换的操作
设置内容：
text() 该方法返回或者设置选中的元素的文本内容
html() 该方法返回或者设置被选中的元素的内容（例如：innerHTML可以包括html标签）
val() 该方法返回或者设置被选元素的值
*/
$(document).ready(function(){
//addClass() 给一个没有添加css的p标签利用jq添加到我们css的.box属性，注意addClass('不要加.号')可以多个或单个多个用空格隔开即可
// $('p').addClass('box mian')
//removeClass() 此方法将 box mian这两个类被删除了
// $('p').removeClass('box mian')
// 弹出我们的attr获取到的p标签的title的属性值
// alert($('p').attr('title'))
//attr获取被选中的元素的title进行修改
// $('p').attr('title','设置新给的属性值')
// alert($('p').attr('title'))
//$声明获取('button')连接上.click(function(){此处写的是方法})
// $('button').click(function(){
//声明获取到的img元素连接上removeAttr删除的方法，删除掉图片的路径
// $('img').removeAttr('src')
// })
// $('button').click(function(){
// alert( $('div').hasrClass('one'))
// })
// $(document).ready(function(){
// $('button').click(function(){
// $('span,b,p').toggleClass('box')
// })
// })
// $('元素').text('元素替换内容')
// $('span').text('恭喜您替换成功！')
// $('元素').html('可替换标签')
// $('p').html('<h1>替换成功！标签元素</h1>')
// $('元素').val('替换成功！我是元素的新值')，设置新值还是会返回一次初始化值
$('input').val('替换成功！我是元素的新值')
})
</script>
</head>
<body>
<!-- <p title="attr测试反馈值">web前端学习计划</p>
<img src="../../../课件/jQuery课件以及源码/jQuery/images/1.jpg">
<button>点击删除图片</button>
<div>您好</div>
<button>点击</button> -->
<span>web前端学习计划</span>
<b>欢迎进入高阶学习中</b>
<p>我是皮标签</p>
<input type="text" value="我是元素的值">
<button>点击切换</button>
</body>
</html>
