W3C home > Mailing lists > Public > public-html-ig-zh@w3.org > October 2010

Re: 讨论一下讨厌的script标签

From: 劭非程 <csf178@gmail.com>
Date: Fri, 22 Oct 2010 21:11:12 +0800
Message-ID: <AANLkTins1QG2SOombv68jFVVPdwKuSzvD9COKd6SJ3CW@mail.gmail.com>
To: John Hax <johnhax@gmail.com>
Cc: (wrong string) 樂會ML <public-html-ig-zh@w3.org>
对 是这意思
实际上代码可能像下面:

<body>
<div id="content">
</div>
<script type="text/javascript">
 //do something
</script>
<div id="footer">......</div>
</body>
如果我在window.onload或者dom ready之后再去执行红色的部分,可能会大大延长用户第一眼看到完整网页的时间

但是现在,我们只能在代码中插入script标签来做这件事

在 2010年10月22日 下午7:35,John Hax <johnhax@gmail.com>写道:

> 劭非的意思并不是整个dom ready,而是单个元素可用的事件。
>
>
> 这种需求是存在的。因为要对有些元素做特殊脚本操作,越早越好。
>
>
> 比如 autofocus
>
>
> 目前为了尽早focus,我们必须:
> <input id="search" ...>
> <script>$('#search').focus()</script>
>
> 实际上最好能这样:
> <head>
> <script>
> document.addEventListener('elementstart', function (event) {
>   var e = event.target
>   if (e.tagName.toLowerCase() == 'input' && e.id="search") e.focus()
> }, false)
> </script>
> </head>
>
> 这个是elementstart,即当时element的子元素还没有ready,只能获得该element的属性。
>
> 另一种是elementend,即当时element已经完全ready。
>
> 举个需求的例子,根据预先指定的方式对table中的项目进行排序:
>
> var sortTableBy = location.hash
>
> document.addEventListener('elementend', function (event) {
>    var e = event.target
>   if (e.tagName.toLowerCase() == 'table') {
>      sortTableByCol(e, sortTableBy)
>   }
> }, false)
>
>
>
>
> 目前标准是没有elementstart/end这种事件的。只有htc(IE6,IE7)和xbl(FF)才能干elementend这种事情。
>
> 2010/10/22 OOO <othree@gmail.com>
>
> 現在有 DOMContentLoaded 事件
>> 觸發時間是在 文件樹建好 ,開始 render 前
>>
>> jQuery 的 Ready 就是會先看瀏覽器之不支援@個事件
>> 不支援的話(IE)會改用 IE hack
>> 一直試著 scroll
>> 沒讀完的話 scroll 都會失敗
>>
>> @部份的議題應該是 DOM 的部份
>> 和 script 標籤沒關係才是
>>
>> script 標籤現在有比較不同的是 async 和 defer 兩個屬性
>>
>> 在 2010年10月22日下午6:59,周裕波 <itchina110@gmail.com> 寫道:
>>  > 我记不太清楚了,好像现在是引入了这样一个事件,有点类似jquery的ready方式
>> > 在 2010年10月22日 下午6:55,劭非程 <csf178@gmail.com>写道:
>> >>
>> >> 大家应该都遇到过一种场景,一段脚本要在某一元素创建以后立即执行:
>> >>
>> >> <div id="content">
>> >> </div>
>> >> <script type="text/javascript">
>> >>  //do something
>> >> </script>
>> >>
>> >> 这是一种很糟糕的做法,至少有2个严重问题:
>> >>
>> >>
>> 1.script标签将阻塞渲染线程,因为要照顾到document.write这种邪恶的写法,后面的渲染必须等待脚本执行完毕,这对于引用单独JS文件的script标签更加致命,渲染必须等待JS文件下载。
>> >>
>> >> 2.行为和表现无法彻底分离,JS代码也无法和HTML代码分离
>> >>
>> >> 所以我在想是否可以引入一事件
>> >>
>> >> body.onElementLoad=function(element) {
>> >>     if(element.id=="content"){
>> >>         //do something
>> >>     }
>> >> }
>> >>
>> >> 大家说说自己的想法
>> >
>> >
>> > --
>> > 此致
>> >
>> > Mr. Zhou YuBo - 周裕波
>> >
>> >  邮件:itchina110@gmail.com
>> >  电话:13717517540
>> >
>>
>>
>>
>> --
>> OOO
>>
>
>
Received on Friday, 22 October 2010 13:11:41 UTC

This archive was generated by hypermail 2.3.1 : Tuesday, 6 January 2015 20:43:46 UTC