代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="jquery3.js"></script>
<style>
.test{
background-color: #428bca;
width: 400px;
height: 48px;
line-height: 48px;
}
.hide{
display: none;
}
</style>
</head>
<body>
<input id="test1" type="button" onclick="openClose()" value="開關">
<div class="test">abcdef</div>
<script>
function openClose() {
//判斷<div>類是否有hie這個屬性
if($(".test").hasClass('hide')){
$(".test").removeClass('hide')
}
else{
$(".test").addClass('hide')
}
//獲取<input>標籤
console.log($('#test1'))
//獲取<input>標籤的類型屬性
console.log($('#test1').attr('type'))
//獲取<input>標籤的value值
console.log($('#test1').attr('value'))
//設置<input>標籤的value值，從開關變成'open&close'
$('#test1').attr('value','open&close')
}
</script>
</body>
</html>
展示
![jQuery 之 樣式及屬性操作]()
