水木社区手机版
- 主题:[js] 像 json 一樣書寫 css
- 如果你習慣于使用 css 編輯器的話也許沒有這個問題
但對我來說，手寫 css 最令人煩惱的事情之一就是一連串層次很深的並列樣式
它意味著你需要使用類似這樣的代碼：
body > div.foo div.bar > #temp span.something ... color1 { ... }
body > div.foo div.bar > #temp span.something ... color2 { ... }
body > div.foo div.bar > #temp span.something ... color3 { ... }
body > div.foo div.bar > #temp span.something ... color4 { ... }
body > div.foo div.bar > #temp span.something ... color5 { ... }
多次重復的相同部分不但是一種浪費
而且試想當你需要改變 #temp 的 id 的時候……
使用一點 js 的技巧可以讓你用 json 的語法來書寫樹形的 css 定義
——實際上，兩者的結構其實是很相似的
附件給出了一個可用的簡單例子
並且顯示了如何用你喜歡的 js 編輯器在 css 代碼中進行導航
注1：使用 fontSize 而不是 font-size 僅僅是爲了省去雙引號的麻煩
但如果你願意的話 "font-size" 的寫法也是可用的
注2：這一代碼在使用了改變 Object 原型的框架（比如 prototype）時將會失效
因爲 for (var-in) 語法將無法再得到乾淨的成員名
--
修改:withinsea FROM 221.221.162.39
FROM 221.222.240.184
附件(3.1KB) css.html - : 注1：使用 fontSize 而不是 font-size 僅僅是爲了省去雙引號的麻煩
: 但如果你願意的話 "font-size" 的寫法也是可用的
: 注2：這一代碼在使用了污染 Object 原型的框架（比如 prototype）時將會失效
: 因爲 for (var-in) 語法將無法再得到乾淨的成員名
对于注2 不同意.
污染这词不好....
其实加上一点代码就可以解决问题了.
看一下这篇文章吧.
http://yuiblog.com/blog/2006/09/26/for-in-intrigue/
//部分摘录(好像连不上)
In all of the A Grade browsers, we should always write for in statements in this form:
for (name in obj) {
if (obj.hasOwnProperty(name)) {
...
}
}
It is deeply annoying that we have to include the extra if statement to filter out the extraneous values. It would seem better to ignore the flaw and code in ignorance. This is possible if you can guarantee that your code will never interact with programs that will augment Object.prototype. But as we get better at mashups and code sharing, ignorance produces brittleness. The standard describes an augmentable Object.prototype. Ignore standards at your own peril.
--
FROM 58.213.113.* - 既然是id,又为什么要改？
【 在 withinsea (沐海~魔導奏器|歌の琴フォルテール) 的大作中提到: 】
: 如果你習慣于使用 css 編輯器的話也許沒有這個問題
: 但對我來說，手寫 css 最令人煩惱的事情之一就是一連串層次很深的並列樣式
: 它意味著你需要使用類似這樣的代碼：
: ...................
--
FROM 221.222.168.* - 赞.
【 在 withinsea (沐海~魔導奏器|歌の琴フォルテール) 的大作中提到: 】
: 如果你習慣于使用 css 編輯器的話也許沒有這個問題
: 但對我來說，手寫 css 最令人煩惱的事情之一就是一連串層次很深的並列樣式
: 它意味著你需要使用類似這樣的代碼：
: ...................
--
FROM 221.216.157.* - 【 在 filiatao (......) 的大作中提到: 】
: 对于注2 不同意.
: 污染这词不好....
嗯，那就說改變好了……
: 其实加上一点代码就可以解决问题了.
確實是可以，只是這種加了一個庫卻需要修改別的代碼的性質我不怎麽喜歡就是了
: ...................
--
修改:withinsea FROM 221.222.240.184
FROM 221.222.240.184 - 呃，這就像說“既然有正確的寫法爲什麽需要 debug”一樣嘛……
反正我是做不到完全避免修改啦。
何況說 id 只是隨便擧個例子
【 在 bigfatcat (bigfatcat) 的大作中提到: 】
: 既然是id,又为什么要改？
--
修改:withinsea FROM 221.222.240.184
FROM 221.222.240.184 - anyway, 有创新
【 在 withinsea (沐海~魔導奏器|歌の琴フォルテール) 的大作中提到: 】
: 如果你習慣于使用 css 編輯器的話也許沒有這個問題
: 但對我來說，手寫 css 最令人煩惱的事情之一就是一連串層次很深的並列樣式
: 它意味著你需要使用類似這樣的代碼：
: ...................
--
FROM 61.149.192.* - 赞
【 在 withinsea (沐海~魔導奏器|歌の琴フォルテール) 的大作中提到: 】
: 如果你習慣于使用 css 編輯器的話也許沒有這個問題
: 但對我來說，手寫 css 最令人煩惱的事情之一就是一連串層次很深的並列樣式
: 它意味著你需要使用類似這樣的代碼：
: ...................
--
FROM 221.219.118.* - 【 在 withinsea (沐海~魔導奏器|歌の琴フォルテール) 的大作中提到: 】
: 标 题: Re: [js] 像 json 一樣書寫 css
: 发信站: 水木社区 (Thu Nov 15 20:03:32 2007), 站内
:
:
: 【 在 filiatao (......) 的大作中提到: 】
: : 对于注2 不同意.
: : 污染这词不好....
: 嗯，那就說改變好了……
: : 其实加上一点代码就可以解决问题了.
: 確實是可以，只是這種加了一個庫卻需要修改別的代碼的性質我不怎麽喜歡就是了
: : .................
其实我也不喜欢... 不过现实是残酷的. 我们只能把自己的代码写的健壮一点, 能适应不同的情况..
:
: --
: 我渴望得到幸福 我渴望得到幸福 和你一起得到幸福 成为你的幸福
: 请带我离开 远远的带我走 离开这个地方
: 小鸟们唱着 听不懂的诗歌 长着翅膀也不能 在空中翱翔
: 独自一人无法到达的地方
:
:
: ※ 修改:·withinsea 于 Nov 15 20:05:05 修改本文·[FROM: 221.222.240.184]
: ※ 来源:·水木社区 newsmth.net·[FROM: 221.222.240.184]
--
修改:withinsea FROM 221.222.240.184
FROM 58.213.113.* - en, 是啊...
【 在 filiatao (......) 的大作中提到: 】
: 其实我也不喜欢... 不过现实是残酷的. 我们只能把自己的代码写的健壮一点, 能适应不同的情况..
--
FROM 221.222.255.161