2. 程式人生 > >art-template 模板引擎

art-template 模板引擎

阿新 • • 發佈：2018-11-10

art-template 模板引擎官網：Art-Template

模板引擎的實現方式有很多，最簡單的是“置換型”模板引擎，這類模板引擎只是將指定模板內容（字串）中的特定標記（子字串）替換一下便生成了最終需要的業務資料（比如網頁）。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>在瀏覽器中使用art-template</title>
</head>
<body>
<!--
1. 安裝：cnpm i art-template
該命令在哪執行就會把包下載到哪裡，預設會下載到 node_modules 目錄中
node_modules 不要改，也不支援改

注意：在瀏覽器中需要引入 lib/template-web.js 檔案

強調：模板引擎不關心你的字串內容，只關心自己能認識的模板標記語法，例如 {{}}
{{}} 語法被稱之為 mustache 語法，八字鬍語法
-->
 

<script src="node_modules/art-template/lib/template-web.js"></script>
<script type="text/template" id="tpl">
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
 

    <h1>大家好，我叫：{{ name }}</h1>
    <p>我今年 {{ age }} 歲了</p>
    <p>我來自 {{ province }}</p>
    <p>我喜歡 {{ each hobbies }} {{ $value }} {{ /each }}</p>
    </body>
    </html>
</script>
<script>
    var ret = template('tpl', {
        name:
 
 'John',
        age: 20,
        province: '北京市',
        hobbies: [
            '寫程式碼',
            '唱歌',
            '打遊戲',
            '游泳'
        ]
    });

    console.log(ret);
</script>
</body>
</html>

在這裡插入圖片描述

相關推薦

thinkjs2.x 配置 art-template 模板引擎

highlight config AD think IE java blank TE body 一、thinkjs2.x默認模板引擎用的是ejs，改用art-template，art-template 是一個簡約、超快的模板引擎（https://aui.github.io/

Express使用art-template模板引擎

文件 deb ons -- render tle get 安裝 目錄 第一步：安裝 npm install --save art-template npm install --save express-art-template 第二步：指定.html使用的解析引擎(官方

art-template模板引擎的使用

作用：渲染引擎時，代替拼接字串的操作。 要配合jquery.js和$.ajax({})來進行使用。 使用方式： 1、先引入外掛template-web.js   此js檔案下載地址在github上，直接搜尋art-template下載即可。 2、自己寫一段模板引擎的js

art-template 模板引擎

art-template 模板引擎官網：Art-Template 模板引擎的實現方式有很多，最簡單的是“置換型”模板引擎，這類模板引擎只是將指定模板內容（字串）中的特定標記（子字串）替換一下便生成了最終需要的業務資料（比如網頁）。 <!DOCTYPE html> &l

nodejs（九）art-template模板引擎

nodejs中可以使用模板引擎，其中art-template既可以用在前端，也可以用在伺服器端，首先看一下前端用法 <!DOCTYPE html> <html lang="en">

08koa art-template 模板引擎

一、常見模板引擎的效能對比 適用於 koa 的模板引擎選擇非常多，比如 jade、ejs、nunjucks、art-template 等。 art-template 是一個簡約、超快的模板引擎。它採用作用域預宣告的技術來優化模板渲染速度，從而獲得接近 Java

art-template模板引擎的簡單使用

下載 git clone https://github.com/aui/art-template 沒安裝git的可以直接開啟網址下載，下載完後使用lib資料夾下的template.js 文字文件 art-template 簡單渲染 HTML程式碼–script裡面的

art-template模板引擎渲染html標籤（替換html）

 Node中的art-template模板引擎，渲染html標籤（替換html） 我們在使用art-template模板引擎時，如果想用html標籤，來渲染內容的話，會遇到一個問題 例如，現在有 app.js使用模板引擎 渲染 index.html app.js  v

高效能art-template模板引擎的使用，template-web.js下載

art-template文件： https://aui.github.io/art-template/docs/syntax.html 引擎js地址： https://raw.githubusercontent.com/aui/art-template/master/l

koa 中art-template模板引擎的使用

一個 bsp 模板 charset oot -a name ext round art-template 模板引擎介紹 art-template 是一個簡約、超快的模板引擎。 它采用作用域預聲明的技術來優化模板渲染速度，從而獲得接近 JavaScript 極限的運行 性

高性能前端 art-template 模板

5.7 正常 變量 生產 else XP shel 代碼 targe 官網： https://aui.github.io/art-template/zh-cn/index.html nodejs 服務器端使用 第一步： 引入 art-template 的包 npm i

milo的template模板引擎

1.首先要引入milo 2.模板中要放一個textarea，並且設定display:none，設定一個id 3，填充的時候，把這個rAdminDetail放到AdminDetail裡面去。（注意：寫的時候，不能用AdminDetail包著要填空的模板結構） <div clas

art-template 模板定義變數並更改變數值 不讓其輸出顯示

在使用art-template.js出現如下的場景： 比如，迴圈體外面定義變數，並且在迴圈體內改變變數的值 但我又不想讓其顯示出來。 那我們一步一步的來實現以上的場景 看看會出現什麼神奇的

js template模板引擎的用法

<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>basic-demo</title> <script src="template-web.js"&

JavaScript中的template模板引擎的使用

關於模板引擎不在此做過多介紹，只將專案程式碼分享一下： 前端html程式碼 前端html中需要引用template.js 檔案，這個自己可以去百度尋找。這個引入要放在jQuery後面，因為它裡面會使用到jQuery。 <div cla

js模板引擎-art-template常用

ava 隱藏 定義函數 debug 很多 原生 語法 console 接受 art-template javascript 模板引擎 分為原生語法和簡潔語法，本文主要是講簡潔語法 基礎數據渲染 輸出HTML 流程控制 遍歷 調用自定義函數方法 子模板引入 基礎數據渲染

瀏覽器端的模板引擎使用—art-template

要點： 1.模板引擎不光能在瀏覽器客戶端中使用， 也能在node等伺服器中使用。 2.在替換模板引擎中佔位符寫完語句後，反而不能新增分號，會報錯。 程式碼： <!DOCTYPE html> <html lang="en"> <head> <

node使用模板引擎art-template

art-template不僅可以在瀏覽器使用，也可以在node使用 安裝： npm    install     art-template 該命令在哪執行就會把包下載到哪裡，預設會下載到node_modules目錄中，node

必須掌握的前端模板引擎之art-template

常用的模板引擎有tpl.js、baiduTemplate、doT.js、art-template等等； 我所理解的模板引擎就是把js資料傳到html中展示出來； art-template 是一個簡約、超快的模板引擎。 art-template有兩種語法： 一、標準語法可以讓模板更容易讀寫； 二、原始

js模板引擎art-template基礎語法和搭配ajax渲染頁面

在github下載的aui/資料夾裡 引入檔案： <script type="text/javascript" src="artTemplate/dist/template.js"></script> 簡易寫法demo： <!DOCTY