jQuery学习笔记（三）－HTML+CSS

最新推荐文章于 2024-05-05 06:39:26 发布

原创最新推荐文章于 2024-05-05 06:39:26 发布 · 1.4k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍jQuery中用于操作HTML、CSS及尺寸的基本函数。包括如何改变HTML内容、添加HTML内容以及设置CSS样式等。适用于初学者快速上手jQuery。

转自W3School：http://www.w3school.com.cn/jquery/index.asp

jQuery 包含很多供改变和操作 HTML 的强大函数。

改变 HTML 内容

例子：

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
  $("p").html("I am ZZ!");
  });
});
</script>
</head>

<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button type="button">请点击这里</button>
</body>

</html>

添加 HTML 内容

$("p").append(" I am Zz!");

jQuery HTML的一些操作

函数	描述
$(selector).html(content)	改变被选元素的（内部）HTML
$(selector).append(content)	向被选元素的（内部）HTML 追加内容
$(selector).prepend(content)	向被选元素的（内部）HTML “预置”（Prepend）内容
$(selector).after(content)	在被选元素之后添加 HTML
$(selector).before(content)	在被选元素之前添加 HTML