页面减肥

本文介绍了一些减少网页体积的方法,包括减少<table>标签的使用、将CSS样式集中到外部文件、图片放置在同一目录、使用简短命名及利用JS函数减少重复代码。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

页面减肥

左直拳

近来给网站的页面瘦身减肥,这里做个总结。

1、 尽量少用<talbe>

使用表格定位很方便,也很精确。不过如果不涉及定位,其实没必要滥用表格。一个表格起码要有一对<table>标记,通常还要写上 cellspacing=”<chmetcnv w:st="on" tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="0" unitname="”">0”</chmetcnv>cellpadding=”<chmetcnv w:st="on" tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="0" unitname="”">0”</chmetcnv> style=”width:100%” border=”<chmetcnv w:st="on" tcsc="0" numbertype="1" negative="False" hasspace="False" sourcevalue="0" unitname="”">0”</chmetcnv>之类,另外每一行又来一对<tr>,再加上单元格的<td>,我的god,太多了吧。我现在做的页面从美工的设计稿修改而来,里面表格嵌套另一个表格,嵌套三、四层是家常便饭,真是痛苦。

听说现在流行div。有时可以使用 div span 代替 table。不过是有时而已, TABLE 的作用仍然无法替代。起码,两样东西同处一行,一个靠左对齐,一个靠右对齐,分处该行的两端,如果用DIVSPAN,我不知道该怎么做。

2、 尽量将CSS写到CSS文件里

将相同的CSS提炼出来,写在CSS文件里,然后用class=来引用。

3、 将常用的图片转移到与页面同一目录

通常做网站都喜欢设置一个images目录,所有的图片都存放在这里。的确方便管理。不过访问量巨大,特别需要瘦身的页面,也许应该可以变通一下,将用到的图片移到同一目录下,避免出现src=”../images/***”的情况。

4、 使用尽量短的名字

ID值、CSSclass名、函数名,如果有必要,可以尽量缩短,比如,只有一个字母。当然,可读性就差了。有时候我们需要权衡取舍,不是吗?

5、 使用JS函数

几个措施之中,我觉得这个效果最为明显。可设置一个函数,将页面中内容相近,只有少许不同的部分改由JS脚本的document.write输出,而将不同部分作为参数输入。比如,有一个列表表格,每行后面都是操作性的按扭,象编辑、删除之类,行与行之间大同小异,改为用JS函数输出,节约的代码量真是非常可观。

在未瘦身前,我们一个页面数据多时可以达到900K。瘦身后200K700K的冗余量。虽说网速越来越快,计算机也越来越先进,但能省则省,也许是什么时候都需要的,不然的话,规模一大,就原形毕露了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值