欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

在JavaScript里嵌入大量字符串常量的實(shí)現(xiàn)方法

 更新時(shí)間:2013年07月07日 19:25:04   作者:  
在JavaScript文件里嵌入大量字符串常量是經(jīng)常遇到的事。有時(shí)為了省事,就把一些界面的HTML和CSS直接寫(xiě)在JS文件里

數(shù)量少還好,多的話就密密麻麻的一坨文字,講究美觀的文藝青年們,會(huì)用大量的字符連接符號(hào)甚至加上縮進(jìn),強(qiáng)制換成好幾行。例如:

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

var html =
    '<div>' +
        '<p>Hello</p>' +
        '<p>World'</p>' +
    '</div>';

這還好,要是字符串里有不少雙引號(hào)單引號(hào),那就更麻煩了,各種轉(zhuǎn)義字符看的眼花繚亂。

  其實(shí)有個(gè)不怎么起眼的小技巧,就能解決這個(gè)問(wèn)題。大家總認(rèn)為字符串必須在"..."或'...'里面,這點(diǎn)沒(méi)錯(cuò)。但還有一個(gè)地方的字符串也能當(dāng)非代碼語(yǔ)義保存下來(lái),那就是一個(gè)function的toString,把整個(gè)函數(shù)的代碼當(dāng)字符串輸出——其中的注釋部分當(dāng)然也是保留的!

  所以我們寫(xiě)個(gè)空函數(shù),里面就一個(gè)/**/注釋,其中就是我們想要的常量?jī)?nèi)容。toString后加一個(gè)正則就可以提取我們想要的!

  馬上試試:

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

var RES_CODE = _TEXT(function(){/*
    #include <iostream>

    int main()
    {
        std::cout << "Hello world" << std::endl;
        return 0;
    }
*/});

var RES_POEM = _TEXT(function(){/*
  更吹落,星如雨。
  寶馬雕車香滿路。
  鳳簫聲動(dòng),玉壺光轉(zhuǎn),一夜魚(yú)龍舞。
  蛾兒雪柳黃金縷,
  笑語(yǔ)盈盈暗香去。
  眾里尋他千百度,
  驀然回首,那人卻在燈火闌珊處。
*/});

var RES_XML = _TEXT(function(){/*
    <projectDescription>
        <name>Hello</name>
        <comment></comment>
        <projects>
        </projects>
        <buildSpec>
            <buildCommand>
                <name>com.adobe.flexbuilder.project.flexbuilder</name>
                <arguments>
                </arguments>
            </buildCommand>
            <buildCommand>
                <name>com.adobe.flexbuilder.project.apollobuilder</name>
                <arguments>
                </arguments>
            </buildCommand>
        </buildSpec>
    </projectDescription>
*/});

function _TEXT(wrap) {
    return wrap.toString().match(/\/\*\s([\s\S]*)\s\*\//)[1];
}
alert(RES_CODE);
alert(RES_POEM);
alert(RES_XML);

OK!就是Chrome里把注釋每行前面的Tab去掉了,如果僅僅是放代碼的話問(wèn)題也不大~ 當(dāng)然有個(gè)前提是字符里不能出現(xiàn)*/

值得注意的是,壓縮代碼的時(shí)會(huì)過(guò)濾注釋,需要手動(dòng)排除一部分。

相關(guān)文章

  • javascript url幾種編碼方式詳解

    javascript url幾種編碼方式詳解

    下面小編就為大家?guī)?lái)一篇javascript url幾種編碼方式詳解。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2016-06-06
  • 原生JS 實(shí)現(xiàn)的input輸入時(shí)表格過(guò)濾操作示例

    原生JS 實(shí)現(xiàn)的input輸入時(shí)表格過(guò)濾操作示例

    這篇文章主要介紹了原生JS 實(shí)現(xiàn)的input輸入時(shí)表格過(guò)濾操作,結(jié)合實(shí)例形式分析了JavaScript基于頁(yè)面元素遍歷、運(yùn)算、判斷實(shí)現(xiàn)的表格過(guò)濾相關(guān)操作技巧,需要的朋友可以參考下
    2019-08-08
  • js中為什么Proxy一定要配合Reflect使用

    js中為什么Proxy一定要配合Reflect使用

    大多數(shù)開(kāi)發(fā)者都了解這兩個(gè)?Es6?中的新增內(nèi)置模塊,可是你也許并不清楚為什么?Proxy?一定要配合?Reflect?使用,本文主要介紹了js中為什么Proxy一定要配合Reflect使用,感興趣的可以了解一下
    2022-04-04
  • Javascript驗(yàn)證Visa和MasterCard信用卡號(hào)的方法

    Javascript驗(yàn)證Visa和MasterCard信用卡號(hào)的方法

    這篇文章主要介紹了Javascript驗(yàn)證Visa和MasterCard信用卡號(hào)的方法,涉及javascript正則驗(yàn)證的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-07-07
  • JavaScript實(shí)現(xiàn)圖片懶加載的三種方案詳解

    JavaScript實(shí)現(xiàn)圖片懶加載的三種方案詳解

    圖片懶加載,當(dāng)圖片出現(xiàn)在可視區(qū)域再進(jìn)行加載,提升用戶的體驗(yàn),這篇文章主要為大家整理了三個(gè)常用的圖片懶加載實(shí)現(xiàn)方法,希望對(duì)大家有所幫助
    2023-12-12
  • 怎么使用javascript深度拷貝一個(gè)數(shù)組

    怎么使用javascript深度拷貝一個(gè)數(shù)組

    一般情況下,使用 “=” 可以實(shí)現(xiàn)賦值。但對(duì)于數(shù)組、對(duì)象、函數(shù)等這些引用類型的數(shù)據(jù),這個(gè)符號(hào)就不好使了。下面我們來(lái)詳細(xì)學(xué)習(xí)下吧
    2019-06-06
  • JS 自動(dòng)完成 AutoComplete(Ajax 查詢)

    JS 自動(dòng)完成 AutoComplete(Ajax 查詢)

    實(shí)現(xiàn)類似于百度或谷歌的搜索下拉列表的,就是打開(kāi)百度往里輸入你要查詢的條件,只要你一輸入他就自動(dòng)彈出一個(gè)下拉列表框,并顯示相關(guān)所有搜索內(nèi)容
    2009-07-07
  • js和jquery如何獲取圖片真實(shí)的寬度和高度

    js和jquery如何獲取圖片真實(shí)的寬度和高度

    按照插入的圖片的尺寸來(lái)判斷圖片是橫圖還是豎圖。然后判斷過(guò)后給予不同的展示方式,下面為大家介紹下js和jquery如何獲取圖片真實(shí)的寬度和高度
    2014-09-09
  • JS中onpropertychange和onchange事件區(qū)別小結(jié)

    JS中onpropertychange和onchange事件區(qū)別小結(jié)

    當(dāng)一個(gè)HTML元素的屬性用js改變的時(shí)候,都能通過(guò)onpropertychange來(lái)捕獲。例如一個(gè)文本text對(duì)象的value屬性被頁(yè)面的腳本修改的時(shí)候,onchange無(wú)法捕獲到,而onpropertychange卻能夠捕獲。
    2010-07-07
  • webpack打包中path.resolve(__dirname, 'dist')的含義解析

    webpack打包中path.resolve(__dirname, 'dist')的含義解

    這篇文章主要介紹了webpack打包中path.resolve(__dirname, 'dist')的含義解析,path:path.resolve(__dirname, 'dist')就是在打包之后的文件夾上拼接了一個(gè)文件夾,在打包時(shí),直接生成,本文給大家講解的非常詳細(xì),需要的朋友可以參考下
    2023-05-05

最新評(píng)論