jQuery-css样式

 

隐藏元素

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<h1>隐藏 HTML 元素</h1>

<h2 id="01">Hello World!</h2>
<h2 id="02">Hello China!</h2>
<h2 id="03">Hello Shanghai!</h2>

<p id="demo"></p>

<script>
$(document).ready(function() {
  var myElement = $("#02");
  myElement.hide();
});
</script>

</body>
</html>

 

显示元素

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<h1>显示 HTML 元素</h1>

<h2 id="01" style="display:none">Hello World!</h2>
<h2 id="02" style="display:none">Hello China!</h2>
<h2 id="03" style="display:none">Hello Shanghai!</h2>

<script>
$(document).ready(function() {
  var myElement = $("#02");
  myElement.show();
});
</script>

</body>
</html>

 

样式化css

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery.min.js"></script>
</head>
<body>

<p id="demo">js能够修改 HTML 元素的样式。</p>

<script>
$(document).ready(function() {
  var myElement = $("#demo");
  myElement.css("font-size","35px");
});
</script>

</body>
</html>

 

posted @ 2022-02-09 16:50  kuaiquxie  阅读(38)  评论(0)  编辑  收藏  举报