国产成人无码Av,可以直接进入网站的正能量视频 ,丁香花在线电影小说观看

模板引擎是基于預(yù)定義好的模板，使用填充數(shù)據(jù)（XCO對(duì)象）進(jìn)行數(shù)據(jù)填充，得到渲染后的HTML代碼。

XCO模板引擎的優(yōu)勢(shì)：

HTML代碼和JS代碼分離
保持原有的HTML代碼和結(jié)構(gòu)
進(jìn)一步提高編碼效率

1. 使用示例

定義模板：

填充數(shù)據(jù)

說明：doCallBack方法中的data參數(shù)為XCO請(qǐng)求后的返回結(jié)果，是一個(gè)XCO對(duì)象，用XML格式表示如下：

<?xml version="1.0" encoding="UTF-8"?> <X> <I K="id" V="1001"/> <S K="name" V="張三"/> </X>

渲染后的HTML

類庫說明

xco.variable-1.0.1.js 標(biāo)記解析類庫
xco.template-1.0.1.js 模板引擎類庫

2.模板的定義和使用

如何定義一個(gè)模板呢？之前的示例已經(jīng)給出答案，我們是通過HTML中的注釋標(biāo)簽來定義模板。注意：一個(gè)模板一定要有一個(gè)所屬的容器，否則我們?cè)趺凑业剿?。在模板中，我們可以設(shè)置一些標(biāo)記，隨后我們?cè)谀０逄畛涞臅r(shí)候，將這些標(biāo)記替換成我們希望的內(nèi)容。

模板中標(biāo)記分為兩種，一種是變量替換標(biāo)記，一種是函數(shù)替換標(biāo)記。

2.1 變量替換

變量替換指的將標(biāo)記中的變量所對(duì)應(yīng)的內(nèi)容替換此標(biāo)記。變量替換的標(biāo)記格式為#{xxx}，其中#表示該標(biāo)記為變量替換標(biāo)記，xxx為變量名。

2.1.1 變量替換之默認(rèn)值

#{xxx|yyy}表示帶有默認(rèn)值的變量替換標(biāo)記。其中：xxx為變量名，|表示后續(xù)的yyy為默認(rèn)值。當(dāng)填充數(shù)據(jù)中，變量xxx所對(duì)應(yīng)的值不存在的時(shí)候，將使用此默認(rèn)值進(jìn)行替換。

示例

填充的數(shù)據(jù)

<?xml version="1.0" encoding="UTF-8"?> <X> <I K="x" V="1001"/> </X>

渲染后的HTML

說明：

如果模板填充數(shù)據(jù)中存在x，則取x的值進(jìn)行替換，否則此處使用默認(rèn)值123進(jìn)行替換；如果模板填充數(shù)據(jù)中存在y，則取y的值進(jìn)行替換，否則此處使用默認(rèn)值中國進(jìn)行替換；

2.1.2 變量替換之表達(dá)式

在變量替換標(biāo)記中，允許存在運(yùn)算表達(dá)式；模板引擎會(huì)將表達(dá)式運(yùn)算結(jié)果作為替換內(nèi)容。

示例

<div id="container"></div>

填充的數(shù)據(jù)

<?xml version="1.0" encoding="UTF-8"?> <X> <I K="x" V="1"/> <I K="y" V="2"/> <I K="z" V="3"/> <D K="money" V="1558.3"/> </X>

渲染后的HTML

說明：

目前支持的運(yùn)算符包括：+、-、*、/、(、)。如果變量替換標(biāo)記中的變量均為Number類型，則表達(dá)式為四則運(yùn)算表達(dá)式，運(yùn)算后的結(jié)果為Number類型；如果其中變量為String類型，則表達(dá)式代表字符串相加，運(yùn)算后的結(jié)果為String類型。

2.1.3 變量替換之函數(shù)調(diào)用

#{xxx@yyy}表示帶有函數(shù)調(diào)用的變量替換標(biāo)記。其中：xxx為變量名，@表示后續(xù)的yyy為所調(diào)用的函數(shù)。模板引擎會(huì)對(duì)于帶有函數(shù)調(diào)用的變量替換標(biāo)記的處理流程是：

取得變量xxx所對(duì)應(yīng)的值，假設(shè)為R1；
將R1作為yyy入?yún)?，?zhí)行yyy函數(shù)，返回結(jié)果假設(shè)為R2；
將R2作為替換內(nèi)容進(jìn)行替換；

示例

<div id="container"></div>

填充數(shù)據(jù)

<?xml version="1.0" encoding="UTF-8"?> <X> <A K="create_time" V="2016-08-03 19:27:06"/> </X>

相關(guān)函數(shù)

function formatDateTime(_date) { return this.format(date, "yyyy-MM-dd"); // 格式化時(shí)間 }

渲染后的HTML

說明

對(duì)于函數(shù)調(diào)用這種方式，一般的應(yīng)用場(chǎng)景是對(duì)于返回結(jié)果中的值做二次處理。比如之前示例中的create_time需要格式化后再進(jìn)行替換。

2.2 函數(shù)替換

函數(shù)替換指的是直接將一個(gè)函數(shù)的返回值作為替換內(nèi)容。函數(shù)替換的標(biāo)記格式為@{xxx}，其中@表示該標(biāo)記為函數(shù)替換標(biāo)記，xxx為函數(shù)名。

示例

<div id="container"></div>

填充數(shù)據(jù)

<?xml version="1.0" encoding="UTF-8"?> <X> <L K="order_id" V="10001"/> <I K="order_state" V="1"/> </X>

調(diào)用示例

渲染后的HTML

說明

在使用函數(shù)替換的時(shí)候，需要額外傳入一個(gè)ext對(duì)象，該對(duì)象中所包含的函數(shù)（方法）即為函數(shù)替換所用到的函數(shù)。對(duì)于函數(shù)getOrderOp的入?yún)?code>xco，就是填充模板時(shí)傳入的填充數(shù)據(jù)data，由框架自動(dòng)傳入。

函數(shù)替換和變量替換之函數(shù)調(diào)用的區(qū)別

入?yún)⒉煌缓瘮?shù)替換的入?yún)檎麄€(gè)填充數(shù)據(jù)對(duì)象，變量替換之函數(shù)調(diào)用的入?yún)樘畛鋽?shù)據(jù)中某一個(gè)值；
變量替換之函數(shù)調(diào)用一般用作于數(shù)據(jù)的二次處理，而函數(shù)替換一般用作為較為復(fù)雜的HTML代碼構(gòu)建；

2.3 列表渲染

對(duì)于使用模板進(jìn)行頁面渲染，最常見的場(chǎng)景就是列表渲染。

定義模板：

<table> <thead> <tr> <th>用戶ID</th> <th>用戶姓名</th> </tr> <tbody id="users"></tbody>
</thead> </table>

填充的數(shù)據(jù)

<?xml version="1.0" encoding="UTF-8"?> <X> <XL K="users"> <X> <L K="user_id" V="101"/> <S K="user_name" V="張三"/> </X> <X> <L K="user_id" V="102"/> <S K="user_name" V="李四"/> </X> <X> <L K="user_id" V="103"/> <S K="user_name" V="王五"/> </X> <X> <L K="user_id" V="104"/> <S K="user_name" V="趙六"/> </X> </XL> <I K="$$CODE" V="0"/> </X>

調(diào)用示例

function doCallBack(data) { var dataList = data.getXCOListValue("users"); var html = ''; for (var i = 0; i < dataList.length; i++) { data.setIntegerValue("i", i); html += XCOTemplate.execute("users", data); } document.getElementById("users").innerHTML = html;
}

渲染后的HTML