render() 函数即渲染函数转换器 converter JS函数用于获取url参数:

大坤...

已于 2022-10-01 14:59:21 修改

阅读量818

点赞数

文章标签： javascript

于 2022-10-01 14:55:27 首次发布

本文链接：https://blog.csdn.net/red_HTML/article/details/127134211

版权

text ( ) 没参数是取值有参数是赋值

after( ) 向选中元素后面添加一个元素

render() 函数即渲染函数

1.引入render

2.引入jquery

3.把上面的 html拿下来引入数据 {{ ： }}

<!-- 在线render -->
            <script src="https://cdn.bootcdn.net/ajax/libs/jsrender/1.0.11/jsrender.min.js"></script>
            <!-- 文本 -->
            <script id="testTmpl" type="text/x-jsrender">
            <li class="list-group-item"><small class="float-right">{{contime:addtime}}</small><a href="/blog/article?id={{:id}}" class="text-reset">{{:username}}</a></li>
            </script>
            <!-- JsRender (js模板引擎) -->
            <script>
                $.views.converters({
                    "contime": function (time) {
                        if (time) {
                            return time.substr(5, 5)
                        }
                    }
                })
                $(function () {
                    // get请求   data数据
                    const conmin = 'http://localhost:3000'
                    $.get(`${conmin}/api/users`, null, function (data) {
                        // empty() 清空数据  
                        // append() 添加数据
                        // render() 函数即渲染函数，它是个函数，它的参数也是个函数——即 createElement
                        $("#list").empty().append($("#testTmpl").render(data));
                    })
                })
            </script>

转换器 `converter`

转换器可以对输出结果进行处理，例如大小写转换等。

语法：

视图 {{“转化器名称”:参数}}
js $.views.converters({"转换器名称":function(参数){...}})

$.views.converters({
                    "contime": function (time) {
                        if (time) {
                            return time.substr(5, 5)
                           //return name.toUpperCase();
                           // toUpperCase() 方法用于把字符串转换为大写。
                        }
                    }
                })

JS函数用于获取url参数:

function getQueryVariable(variable)
{
       var query = window.location.search.substring(1);
       var vars = query.split("&");
       for (var i=0;i<vars.length;i++) {
               var pair = vars[i].split("=");
               if(pair[0] == variable){return pair[1];}
       }
       return(false);
}

使用实例
url 实例：
http://www.baidu.com/index.php?id=1&image=awesome.jpg

调用 getQueryVariable(“id”) 返回 1。
调用 getQueryVariable(“image”) 返回 “awesome.jpg”。