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

偵測某元素的自動高（寬）度的時候，這個值會隨著樣式表給定不同寬（高）度、邊界、補丁等因素而改變，所以一定得在樣式表載入之後才能抓到正確的高（寬）度。

像是：
http://ethantw.net/projects/lab/ch-vertical/



在 Oct 22, 2010 8:04 PM 時， OOO 寫到：

> 我是感覺不到這樣的必要性啦
> focus 而言有 autofocus
> 或許還有其他例子？
> 
> 我剛剛看了一下 DOM Event Level 3
> DOMNodeInsertedIntoDocument[1] 這個事件似乎有點接近
> 只是不知道定義上第一次 parse 文件樹時算不算就是
> 
> [1]:http://www.w3.org/TR/DOM-Level-3-Events/#event-type-DOMNodeInsertedIntoDocument
> 
> 在 2010年10月22日下午7:47，Ethan Chen <chief@ethantw.net> 寫道：
>> 实际上最好能这样：
>> <head>
>> <script>
>> document.addEventListener('elementstart', function (event) {
>>   var e = event.target
>>   if (e.tagName.toLowerCase() == 'input' && e.id="search") e.focus()
>> }, false)
>> </script>
>> </head>
>> 
>> 這能用在<link type="text/css" href="./style.css">上嗎？就是在style.css載入完成之後。
>> 尤其有時候DOM已經ready了，樣式表還是沒有下載完成。
>> 
>> 
>> 在 Oct 22, 2010 7:35 PM 時， John Hax 寫到：
>> 
>> 劭非的意思并不是整个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
>> 
>> 
>> 
> 
> 
> 
> -- 
> OOO

Received on Friday, 22 October 2010 15:19:51 UTC