If you're seeing this message, it means we're having trouble loading external resources on our website.

如果你被网页过滤器挡住,请确保域名*.kastatic.org*.kasandbox.org 没有被阻止.

主要内容

回顾:使用 jQuery 修改 DOM

一旦你使用jQuery函数找到元素集合后,你就可以使用各种方法更改它们。
用该命令设置内部文本 text():
$("h1").text("All about cats"); (查看例子)
用该命令设置内部文本 html():
$("h1").html("I <strong>love</strong> cats"); (查看例子)
用该命令设置属性 attr():
$(".dog-pic").attr("src", "dog.jpg");
$(".google-link").attr("href", "http://www.google.com"); (查看例子)
用该命令修改 CSS 样式 css():
$("h1").css("font-family", "monospace");
$("h1").css({"font-family": "monospace", "color": "red"}); (查看例子)
用该命令添加类别 addClass():
$("h1").addClass("warning");
你还可以通过将 HTML 字符串传递到 jQuery 函数中创建新元素:
var $p = $("<p>");
如果需要,你可以传入完整的 HTML,包括标记内容,属性及样式。
var $p = $('<p style="color:red;">I love people who love cats.</p>');
一旦创建了一个元素,你就可以用以上任何方法对其进行修改:
$p.addClass("warning");
然后你可以使用该命令来把它附加到某个已存在的元素上 append():
$("#main-div").append($p); (查看例子)
你也可以使用 prepend() (查看例子) 或者是 appendTo() (查看例子).
按照上面链接方法名称,阅读jQuery文档以了解每一种方法的更多详细信息。我们无法涵盖所有内容,并且随着网页开发最佳实践指南的快速更新变化,你需要很会阅读文档才能及时了解最新和最好的内容。最好现在就开始练习这项技能吧!

想加入讨论吗?

尚无帖子。
你会英语吗?单击此处查看更多可汗学院英文版的讨论.