简明现代魔法 -> JQuery -> JQuery 学习：改变HTML元素的内容

JQuery 学习：改变HTML元素的内容

2010-04-22

show() 和 html() 的使用：

$("span").addClass("css_style").show().html("foo");

首先增加样式，然后用 show() 显示隐藏的匹配元素，html("foo") 设置每一个匹配元素的 html 内容。

效果演示： 我才是原本的内容！我被 JQuery 改了

Code

<style> .nowamagic { color:red; } </style> <script type="text/javascript"> $(document).ready(function(){ $("span").addClass("nowamagic").show().html("简明现代魔法"); //对比：$("a").addClass("test").html("cssrain"); }); </script> <span>我才是原本的内容！我被 JQuery 改了</span>

上述 JQuery 实现了什么呢？首先，它找到 span 的 HTML 元素，然后给它加上名为 nowamagic 的 CSS 样式，再把这个 HTML 的元素的换成 html() 方法内的参数。