最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

把JS與CSS寫在同一個文件里的書寫方法

 更新時間:2007年06月02日 00:00:00   作者:  
我們經(jīng)常把多個CSS或者多個JS并成一個,以節(jié)省請求,但是這樣最少還是要兩個。在MSDN的Blog上看到原來也是可以把JS和CSS并在一個文件里,那怎樣做呢?利用注釋,先看一下這代碼。 
<!-- /*
window.onload=function(){
document.getElementById("test2").innerHTML="傳說中滴JS測試者。如果你看到我,那<strong>JS</strong>也生效了";
}
<!-- */ 
<!-- #test1,#test2{border:3px #000 solid;padding:5px;color:#123456;background-color:#ccc;} strong{color:red;}

CSS處理時會忽視掉<!--,這時JS部分只是CSS的注釋/* js */,而JS處理時把<!--轉(zhuǎn)成// 也就是JS的單行注釋,單行注釋會把后面的/*和*/干掉,同時也干掉了CSS,不廢話了,看演示的例子。

在網(wǎng)上運行時還要通過程序輸出個“*/*”的頭,不然MIME不對有的瀏覽器不干活。PHP的是這樣:

<?header('Content-type: */*');?>

理論上在服務(wù)器上指定某種后綴的MIME是“*/*”應(yīng)用也行得通,不過我沒有試。把JS跟CSS寫在同一個文件特別適合第三方調(diào)用的那種,雖然文件大了一點,但能少了一半的請求數(shù),帥帥滴

當(dāng)然,這樣的格式寫起來一定很不爽,不過配合程序來讀原來已經(jīng)的,并處理一下就可以,這樣就可以保持原來文件也方便維護,輸出文件又省點請求,如果想的話,處理處理緩存,跟靜態(tài)文件差不多了。這里有份C#的,據(jù)說是官方滴,我的是PHP的,因為還沒寫緩存的機制就不拿出來丟人了,其實原理也很簡單,會編程的三兩下就搞定。

再其實,我是想找把多份CSS合并的方式,合成一個不難,可以是處理好各模塊化的分離同時能在客戶端緩存及方便程序調(diào)用才是難的,CSS又不像JS可以在客戶端異步調(diào)用,誰有好的方式介紹一下給我。

傳說中的測試
傳說中的測試者一號。如果你看到我有邊框跟顏色,那就是說CSS生效了。

傳說中滴JS測試者。如果你看到我,那JS也生效了

復(fù)制代碼 代碼如下:

使用同一份文件:jscss.php 
<link type="text/css" rel="stylesheet" href="jscss.php" /><script type="text/javascript" src="jscss.php"></script>jscss.php的內(nèi)容 
<?header('Content-type: */*');?> 
<!-- /* 
window.onload=function(){ 
    document.getElementById("test2").innerHTML="傳說中滴JS測試者。如果你看到我,那<strong>JS</strong>也生效了"; 

<!-- */  
<!-- #test1,#test2{border:3px #000 solid;padding:5px;color:#123456;background-color:#ccc;} strong{color:red;} 
Copyright © 2006-2007 aoao , Some Rights Reserved . 

相關(guān)文章

  • javascript用defineProperty實現(xiàn)簡單的雙向綁定方法

    javascript用defineProperty實現(xiàn)簡單的雙向綁定方法

    這篇文章主要介紹了javascript用defineProperty實現(xiàn)簡單的雙向綁定方法,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
    2020-04-04
  • 實例詳解ECMAScript5中新增的Array方法

    實例詳解ECMAScript5中新增的Array方法

    這篇文章主要介紹了實例詳解ECMAScript5中新增的Array方法的相關(guān)資料,需要的朋友可以參考下
    2016-04-04
  • JavaScript實現(xiàn)簡單的tab選項卡切換

    JavaScript實現(xiàn)簡單的tab選項卡切換

    這篇文章主要介紹了JavaScript實現(xiàn)簡單的tab選項卡切換的相關(guān)資料,需要的朋友可以參考下
    2016-01-01
  • 網(wǎng)絡(luò)請求axios與fetch的區(qū)別及使用示例

    網(wǎng)絡(luò)請求axios與fetch的區(qū)別及使用示例

    Fetch和Axios是兩個常用的JavaScript庫,用于處理數(shù)據(jù)請求,下面這篇文章主要給大家介紹了關(guān)于網(wǎng)絡(luò)請求axios與fetch的區(qū)別及使用的相關(guān)資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下
    2024-04-04
  • JSQL 批量圖片切換的實現(xiàn)代碼

    JSQL 批量圖片切換的實現(xiàn)代碼

    其實這個example也很簡單, 就是根據(jù)where后的條件批量修改element的屬性,此處為Img元素
    2010-05-05
  • JS阻止事件冒泡行為和閉包的方法

    JS阻止事件冒泡行為和閉包的方法

    這篇文章主要介紹了JS阻止事件冒泡行為和閉包的方法的相關(guān)資料,需要的朋友可以參考下
    2016-06-06
  • 五段實用的js高級技巧

    五段實用的js高級技巧

    五段實用的js高級技巧,一些不錯的小技巧,學(xué)習(xí)js的朋友可以看看。
    2011-12-12
  • JavaScript如何將時間戳轉(zhuǎn)化為年月日時分秒格式

    JavaScript如何將時間戳轉(zhuǎn)化為年月日時分秒格式

    這篇文章主要給大家介紹了關(guān)于JavaScript如何將時間戳轉(zhuǎn)化為年月日時分秒格式的相關(guān)資料,在前端的日常工作當(dāng)中,時間戳的使用也是不少的,有時后端返回給我們的數(shù)據(jù)是一個時間戳,我們需要轉(zhuǎn)換成年月日,時分秒的形式展示在頁面當(dāng)中,需要的朋友可以參考下
    2023-11-11
  • javascript顯示隱藏層比較不錯的方法分析

    javascript顯示隱藏層比較不錯的方法分析

    通常的解決辦法是把“答案”當(dāng)作整個問題容器的子元素,然后點擊父元素上的按鈕后展開對應(yīng)的子元素。通過父子元素的對應(yīng)關(guān)系來匹配標題和答案。
    2008-09-09
  • 詳解ES9的新特性之異步遍歷Async iteration

    詳解ES9的新特性之異步遍歷Async iteration

    在ES6中,引入了同步iteration的概念,隨著ES8中的Async操作符的引用,是不是可以在一異步操作中進行遍歷操作呢?今天要給大家講一講ES9中的異步遍歷的新特性Async iteration。
    2021-06-06

最新評論

枝江市| 平邑县| 哈巴河县| 麻城市| 盐源县| 蒲江县| 建始县| 揭东县| 吐鲁番市| 新平| 宁南县| 孝感市| 锡林浩特市| 吐鲁番市| 丹巴县| 封开县| 淳安县| 维西| 四会市| 伊金霍洛旗| 扶风县| 繁昌县| 城步| 邓州市| 永登县| 南昌市| 玛纳斯县| 合肥市| 华容县| 蒙自县| 沁水县| 九江市| 宁陵县| 武胜县| 巴马| 军事| 武夷山市| 个旧市| 禄劝| 古交市| 马边|