发表新帖
发表新帖

Getting content of a script file using Javascript

前端 未结
关注
8 1195
谎友^
谎友^ 2021-02-07 19:38

I have the following script element in my web page:

Using JavaScript,

相关标签:
8条回答
  • 悲哀的现实
    2021-02-07 19:41

    Why not use Ajax (well Ajah because its html :-))?

    when the server is set up correctly and no no-cache or past expires headers are sent, the browser will cache it.

    0 讨论(0)
  • 故里飘歌
    2021-02-07 19:43

    Using an iFrame & HTML5 Local Storage

    Save the templates for rendering later...

    not stoked about the iFrame, but it seems to be working pretty good (haven't ran performance tests yet)

    Put the iFrame on the page you want the template on (index.html)

    <html>
  <head>
    <iframe src="mustache.Users.html" onload="this.remove();" class="hidden" id="users_template"></iframe>
  </head>
</html>
    • Make sure the src attribute is set
    • hide the element until you can get rid of it after it loads

    Put this body wrapper around your template (mustache.Users.html)

    (don't worry it won't show up in the template)

    <body onload="localStorage.setItem('users_template',this.document.body.innerHTML);"> 
  <ul class="list-group" id="users" >
    {{#users}}<li>{{name}}</li>{{/users}}
  </ul>
</body>
    • replace 'users_template' with whatever name for your variable
    • the 'onload' attribute saves the template into localStorage during load

    Now You can access your templates from anywhere 

    localStorage.getItem('users_template')

    OR 

    window.localStorage.getItem('users_template')

    check out this image to see it in Chrome

    0 讨论(0)
  • 北恋
    2021-02-07 19:44

    unless you load a script as literal text in the page, it does not exist as text. It is interpreted by the browser and melded into the runtime, with any other scripts.

    If you want the source you have to fetch it again,if with Ajax get the responseText.

    It will come from the browser cache, and doesn't have to be downloaded again.

    0 讨论(0)
  • 我在风中等你
    2021-02-07 19:50

    I think what you want to do is to assign a variable inside template.js. Then you have the variable available for use wherever you want in jquery. Something like:

    var tpl = "<div> ... </div>"

    Wouldn't this be a simpler solution to your problem? We do this in Ext JS. I think this will work for you in jQuery.

    0 讨论(0)
  • 温柔的废话
    2021-02-07 19:50

    If I understand you correctly, you don't want to use Ajax to load an html template text, but rather have it loaded with the rest of the page. If you control the server side, you can always include the template text in an invisible div tag that you then reference from Javascript:

    <div id="template" style="display:none;">
...template text...
</div>
<script>
// pops up the template text.
alert(document.getElementById("template").innerHTML);
</script>

    If you are just looking for to load the template so that you can have it cached, you can put the contents in a variable like this:

    <script>
var template = "template text..";
</script>

    or you can load it using ajax and store the template in a variable so it is accessible. It's pretty trivial in jquery:

    var template;
$.get("template.html", function(data){
  template = data;
});
    0 讨论(0)
  • 抹茶落季
    2021-02-07 19:50

    The way that most JavaScript import files work is they include a script, that immediately calls a function with a parameter of certain text, or of another function. To better illustrate, say you have your main index.html file, set it up like this:

    <html>
<head>
</head>
<body>
<script>
let modules = {};
function started(moduleName, srcTxt) {
    modules[moduleName] = (srcTxt) //or something similar
}
</script>

<!--now you can include other script tags, and any script tags that will be included, their source can be gotten (if set up right, see later)-->

<script src="someOtherFile.js"></script>
</body>
</html>

    now make that other file, someOtherFile.js, and right away when its loaded, simply call that "started" function which should already be declared in the scope, and when thats done, then whatever text is passed, from the file, is stored in the main index.html file. You can even stringify an entire function and put it in, for example:

    started("superModule", (function() {
    /*
    <?myCustomTemplateLanguage
    <div>
    {something}Entire Javascript / html template file goes here!!{/something}
    </div>
    ?>
    */
}).toString());

    now you can access the inner content of the function, and get all the text in between the comments, or better yet, then do other parsing etc, or make some other kind of parsing identifiers at the beginning and end of the comments, as shown above, and get all text in between those

    0 讨论(0)
 看不清?
提交回复
热议问题