使用 jQuery,第 2 部分: 构建未来的 Web 应用程序
2009-08-29 00:00:00 来源:WEB开发网CSS 处理
本文最后的这个部分将要介绍如何在不调整样式表或重载此页面的情况下动态地处理页面的 CSS。我们将能够通过简单更改颜色、字体等向页面添加一些基本效果。jQuery 的 CSS 实际上是整个库最初的创意来源。其目标是让页面上的 CSS 编程更容易。正如您所见,此项目随后得到了充分的发展。但是项目的初衷并没有改变,jQuery 的确简化了 CSS 编程。不过,我还是先要说明一点,即 jQuery 为处理 CSS 所提供的那些传统函数实际上已经不能适应当今的 Web 环境。然后,我会介绍可以使用的其他函数(也是 jQuery 内的)。
有两个基本函数可用来处理页面上的 CSS。可以先以字符串传递单个属性,然后再以字符串传递单个值,也可以用字符串/字符串数组的形式一次传递。这两个函数的功能基本相同,并且可以很容易地更改页面的 CSS。
清单 9. css() 函数
// change the background of every div to red
$("div").css("backgroundColor", "#ff0000");
// - or -
$("div").css("backgroundColor", "red");
// - or -
$("div").css({backgroundColor: "#ff0000"}); // notice the braces and lack of quotes
可以看出这些函数非常简单直观,很容易理解和掌握。不过,考虑到目前 Web 页面设计的潮流,这些函数还存在一些问题。常规的 Web 页面都是从页面删除样式,然后在样式表中填入一个外部文件或代码片段。如果能采用其他办法,您肯定不 希望将样式代码放入 JavaScript 代码中。否则,将来更改站点的外观将十分困难。
编缉推荐阅读以下文章
- 使用 jQuery,第 3 部分: 用 jQuery 和 Ajax 构建富 Internet 应用程序
- 使用 jQuery,第 1 部分: 将桌面应用程序引入浏览器
更多精彩
赞助商链接