HTML 操作方法:
1. text(): 获取或设置元素的文本内容。
var content = $("#myElement").text(); // 获取元素文本内容
$("#myElement").text("New Text Content"); // 设置元素文本内容
2. html(): 获取或设置元素的 HTML 内容。
var content = $("#myElement").html(); // 获取元素 HTML 内容
$("#myElement").html("<p>New HTML Content</p>"); // 设置元素 HTML 内容
3. val(): 获取或设置表单元素的值。
var value = $("#myInput").val(); // 获取输入框的值
$("#myInput").val("New Value"); // 设置输入框的值
4. append() / prepend(): 在元素内部末尾或开头添加内容。
$("#myElement").append("<p>Appended Text</p>"); // 在末尾添加内容
$("#myElement").prepend("<p>Prepended Text</p>"); // 在开头添加内容
5. after() / before(): 在元素之后或之前插入内容。
$("#myElement").after("<div>After Element</div>"); // 在元素之后插入内容
$("#myElement").before("<div>Before Element</div>"); // 在元素之前插入内容
CSS 操作方法:
1. css(): 获取或设置元素的 CSS 属性。
var color = $("#myElement").css("color"); // 获取元素的颜色属性
$("#myElement").css({
"color": "blue",
"font-size": "16px"
}); // 设置元素的颜色和字体大小
2. addClass() / removeClass() / toggleClass(): 添加、移除或切换元素的类。
$("#myElement").addClass("highlight"); // 添加类
$("#myElement").removeClass("highlight"); // 移除类
$("#myElement").toggleClass("highlight"); // 切换类
3. height() / width(): 获取或设置元素的高度或宽度。
var height = $("#myElement").height(); // 获取元素的高度
$("#myElement").height(200); // 设置元素的高度
4. offset(): 获取或设置元素相对于文档的偏移位置。
var offset = $("#myElement").offset(); // 获取元素的偏移位置
$("#myElement").offset({ top: 100, left: 50 }); // 设置元素的偏移位置
这些是一些基本的 jQuery HTML 和 CSS 方法,它们使得在页面上进行文档结构和样式的操作变得非常便捷。详细信息可以在[官方文档的 Manipulation 部分](https://api.jquery.com/category/manipulation/)和[CSS 部分](https://api.jquery.com/category/css/)找到。
转载请注明出处:http://www.zyzy.cn/article/detail/4641/jQuery