jQueryd的基础语法
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery基础语法</title>
<script src="js/jquery-3.3.1.min.js"></script>
<style>
.box{
width: 300px;
height: 300px;
background-color: lightyellow;
}
</style>
</head>
<body>
<div class="box"></div>
<button class="show">显示</button>
<button id="hide">隐藏</button>
<script>
/**
* jQuery 使用 CSS 选择器来选取 HTML 元素。
* $("p") 选取 <p> 元素。
* $("p.intro") 选取所有 class="intro" 的 <p> 元素。
* $("p#demo") 选取所有 id="demo" 的 <p> 元素。
* $("[href]") 选取所有带有 href 属性的元素。
* $("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
* $("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
* $("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
*/
/**
* jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。
* $("p").css("background-color","red");
*/
$ (document).ready(function () {
$ ('.show').click(function () {
$('.box').show();
});
$ ('#hide').click(function () {
$('.box').hide();
});
});
</script>
</body>
</html>