jQuery操作属性的方法
jQuery操作属性的方法
Query操作属性其原理还是对DOM的操作
通过对象的关系,对节点树中的元素进行操作的方法有以下几种：
1. addClass()该方法向被选中的元素中添加一个或多个类（多个类用空格隔开）
2.removeClass()该方法从给选中的元素中移除一个或者多个类
3.attr()该方法设置或者返回被选中元素的属性值
4. removeAttr()该方法从被选中的元素中移除属性
5.hasClass()该方法检查被选中的元素是否包含指定的class
6. toggleClass()该方法对被选中的元素进行添加/删除类的切换操作
设置内容：
1.text()该方法返回或者设置被选中的元素的文本内容
2.html()该方法返回或者设置被选中的元素内容(类似innerHTML 可以包括html标签)
3.val()该方法返回或者设置被选中的元素的值
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery操作属性的方法</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<style type="text/css">
.box{color: red;}
.main{font-weight: bold;font-size: 40px;}
</style>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('p').addClass('box main')
$('p').removeClass('box main')
alert($('p').attr('title'))
$('p').attr('title','你好')
alert($('p').attr('title'))
$('button').click(function(){
$('img').removeAttr('src')
})
$('button').click(function(){
alert($('div').hasClass('one'))
})
$('button').click(function(){
$('span,b,p').toggleClass('color','red')
})
//alert($('span').text())
$('span').text('大家好，我是星辰')
$('b').text('hello world')
//alert($('p').html())
$('p').html('<h1>helloworld!<h1>')
//alert($('input').val())
$('input').val('我是被改变的元素的值')
})
</script>
<p title="content">php中文网</p>
<img src="images/1.jpg">
<button>点击删除图片</button>
<div class="">你好</div>
<button>点击</button>
<span>大家好，我是小师太</span><br>
<b>欢迎来到</b>
<p>php中文网</p>
<button>点击切换</button>
<input type="text" value="我是元素的值">
</body>
</html>