zoukankan      html  css  js  c++  java
  • require.js text 插件使用

    相比于使用script构建DOM结构,使用HTML标签来构建html是一个很好的方式。然而, 并没有很好的方式可以在js文件中嵌入 HTML 。最好的方式是使用 HTML字符串, 但这很难管理,尤其实在多行HTML的时候。

    text.js 能解决这个问题。如果依赖添加了 text!前缀它将会被自动加载。下载该插件并且将它放在应用程序的 baseUrl 目录(如果想放在其他地方,使用 paths config 进行配置).

    You can specify a text file resource as a dependency like so:

    require(["some/module", "text!some/module.html", "text!some/module.css"],
        function(module, html, css) {
            html 变量是some/module.html 文件的文本形式
            css变量是some/module.css 文件的文本形式 
        }
    );
    

    注意.html 和.css 后缀规定了文件的类型。  路径"some/module"部分将会根据标准模块名进行解析:它将使用 baseUrl 和 paths configuration options 进行查找。

    对于 HTML/XML/SVG 文件, 有其他的配置选项。你可以传入一个 !strip, 它将去除XML申明,这样外部的 SVG 和 XML 文件就能安全地加载到 document 中,同样的,如果是 HTML,只有 body 标签内部的部分会被返回。例如:

    require(["text!some/module.html!strip"],
        function(html) {
            //the html variable will be the text of the
            //some/module.html file, but only the part
            //inside the body tag.
        }
    );
    

    text 文件通过异步的方式进行加载(XHR) , 所以你只能获取同域地下的文件 (查看下面XHR 限制条件).

    然而, the RequireJS optimizer 将会在模块中内置 text! 真实text 文件内容参考, 这样, 依赖text!的模块能使用其他域的文件

  • 相关阅读:
    盒模型
    DTD
    JS 中的 __proto__ 、prototype、constructor
    ES 5 中 判断数组的方法
    js keyup、keypress和keydown事件
    webpack 安装 url-loader 模块后,图片地址展示错误问题
    前端展示PDF内容
    对象的深拷贝
    IE 11 中不知promise 的 finally 方法
    js判断一个字符串是否为纯数字组成
  • 原文地址:https://www.cnblogs.com/hwldyz/p/9166918.html
Copyright © 2011-2022 走看看