Получение содержимого файла script с помощью Javascript

У меня есть следующий элемент script на моей веб-странице:

<script src="default.js" type="text/javascript"></script>

Используя JavaScript, я хочу получить информацию из файла script. Я знаю, что могу использовать запрос ajax для получения данных, но затем я получаю что-то с сервера, который у меня уже есть на локальном компьютере.

Итак, что бы я предпочел сделать, это получить содержимое из DOM (если это возможно) или что-то, что имеет тот же результат.

Приветствия Энтони

ОБНОВЛЕНИЕ

Я пытался упростить вопрос, может быть, плохую идею, я думал, что этот способ может вызвать меньше вопросов.

Реальная ситуация у меня следующая: у меня есть

<script type="text/html" class="jq-ItemTemplate_Approval">
   ...
   html template that is going to be consumed by jQuery and jTemplate
   ...
</script>

Теперь это прекрасно работает, но это означает, что каждый раз, когда загружается страница, я должен отправлять шаблон в виде части главной страницы. Поэтому я планировал сделать следующее:

<script src="template.html" type="text/html"></script>

Это означало бы, что браузер будет кэшировать содержимое template.html, и мне не придется отправлять его каждый раз. Но для этого мне нужно получить содержимое из файла.

Также в этом случае, насколько мне известно, запрашивать контент через ajax не поможет, так как он должен вернуться на сервер, чтобы получить контент в любом случае.

Ответ 1

Я думаю, что вы хотите назначить переменную внутри template.js. Затем у вас есть переменная, доступная для использования везде, где вы хотите в jquery. Что-то вроде:

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

Разве это не было бы более простым решением вашей проблемы? Мы делаем это в Ext JS. Я думаю, что это сработает для вас в jQuery.

Ответ 2

Если вы правильно поняли, вы не хотите использовать Ajax для загрузки текста шаблона html, а скорее загрузите его с остальной частью страницы. Если вы контролируете сервер, вы всегда можете включить текст шаблона в невидимый тег div, который затем ссылается на Javascript:

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

Если вы просто хотите загрузить шаблон, чтобы его можно было кэшировать, вы можете поместить его в переменную следующим образом:

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

или вы можете загрузить его с помощью ajax и сохранить шаблон в переменной, чтобы он был доступен. Это довольно тривиально в jquery:

var template;
$.get("template.html", function(data){
  template = data;
});

Ответ 3

если вы не загрузите script как литеральный текст на странице, он не существует в виде текста. Он интерпретируется браузером и объединяется во время выполнения с любыми другими скриптами.

Если вам нужен источник, вы должны его снова извлечь, если с Ajax получите ответText.

Он будет поступать из кеша браузера, и его не нужно будет загружать снова.

Ответ 4

Вы можете получить атрибут src script, а затем использовать XHR для получения содержимого JS файла. Это гораздо более чистый способ сделать это ИМО. например: -.

if(window.XMLHttpRequest) {
                var xhr = new XMLHttpRequest();         
                xhr.onreadystatechange = function() {
                    if(xhr.status == 200 && xhr.readyState == 4) {
                        var sourceCode = xhr.responseText;
                                            alert('The source code is:-\n'+sourceCode);
                    }
                }
                xhr.open("GET",document.getElementById('scriptID').src,true);
                xhr.send(null);
            }

Ответ 5

Использование локального хранилища iFrame и HTML5

Сохраните шаблоны для рендеринга позже...

не топится о iFrame, но, похоже, он работает неплохо (еще не прошел тесты производительности)


Поместите iFrame на страницу, на которой вы хотите использовать шаблон (index.html)

<html>
  <head>
    <iframe src="mustache.Users.html" onload="this.remove();" class="hidden" id="users_template"></iframe>
  </head>
</html>
  • Убедитесь, что установлен src.
  • скрыть элемент, пока вы не сможете его освободить после загрузки

Поместите эту оболочку тела вокруг вашего шаблона (mustache.Users.html)

(не волнуйтесь, он не появится в шаблоне)

<body onload="localStorage.setItem('users_template',this.document.body.innerHTML);"> 
  <ul class="list-group" id="users" >
    {{#users}}<li>{{name}}</li>{{/users}}
  </ul>
</body>
  • заменить 'users_template' на любое имя для вашей переменной
  • атрибут onload 'сохраняет шаблон в localStorage во время загрузки

Теперь вы можете получить доступ к своим шаблонам из любого места

localStorage.getItem('users_template')  

ИЛИ

window.localStorage.getItem('users_template')

check out this image to see it in Chrome

Ответ 6

Что находится в файле JavaScript? Если это фактический код, вы можете запускать функции и ссылочные переменные там, как вы вырезали и вставляете их на веб-страницу. Вы хотите поместить строку include над любыми script блоками, которые ссылаются на нее.

Это то, что вы хотите выполнить?

Ответ 7

Почему бы не использовать Ajax (хорошо Ajah, потому что его html: -))?

когда сервер настроен правильно и не отправляются никакие кеширование или прошлое заголовки, браузер будет кэшировать его.