Если у меня есть тег script, как это:
<script
id = "myscript"
src = "http://www.example.com/script.js"
type = "text/javascript">
</script>
Я хотел бы получить содержимое файла script.js ". Я думаю о чем-то вроде document.getElementById("myscript").text, но в этом случае он не работает.
Вы хотите получить содержимое файла http://www.example.com/script.js? Если это так, вы можете обратиться к методам AJAX для извлечения его содержимого, предполагая, что он находится на том же сервере, что и сама страница.
Не могли бы вы рассказать о том, чего вы пытаетесь достичь?
Я знаю это немного поздно, но некоторые браузеры поддерживают свойство LINK rel="import".
http://www.html5rocks.com/en/tutorials/webcomponents/imports/
<link rel="import" href="/path/to/imports/stuff.html">
В остальном ajax по-прежнему является предпочтительным.
Я не думаю, что содержимое будет доступно через DOM. Вы можете получить значение атрибута src и использовать AJAX для запроса файла с сервера.
если вы хотите содержимое атрибута src, вам нужно будет выполнить запрос ajax и посмотреть на отзыв. Если у вас есть js между ними, и вы можете получить к нему доступ через innerHTML.
Это может представлять интерес: http://ejohn.org/blog/degrading-script-tags/
У меня была та же проблема. Кажется, что нет пути (за исключением ajax), чтобы решить эту проблему в html файлах. Но когда я нахожусь в php, по крайней мере, следующее оказалось очень полезным:
<script type="text/javascript" id="myScript"><?php readfile('filepath/myScript.js'); ?></script>
Затем вы можете захватить содержимое тега script обычным getElementById('myScript').text;
.text сделал вам содержимое тега, просто у вас ничего нет между вашим открытым тегом и вашим конечным тегом. Вы можете получить атрибут src элемента с помощью .src, а затем, если вы хотите получить файл javascript, вы будете следовать ссылке и сделать запрос ajax для него.
В комментарии к моему предыдущему ответу:
Я хочу сохранить содержимое script, чтобы я мог кэшировать его и использовать его непосредственно через некоторое время без необходимости его извлечения с внешнего веб-сервера (не на том же сервере, что и на странице)
В этом случае вам лучше использовать серверную часть script для извлечения и кэширования файла script. В зависимости от настройки сервера вы можете просто загрузить файл (периодически через cron, если вы ожидаете его изменения) или сделать что-то подобное с небольшим script на вашем языке по вашему выбору.
Вы хотите использовать свойство innerHTML для получения содержимого тега script:
document.getElementById("myscript").innerHTML
Но, как сказал @olle в другом ответе, вы, вероятно, захотите прочитать: http://ejohn.org/blog/degrading-script-tags/
да, Ajax - это способ сделать это, как в принятом ответе. Если вы перейдете к деталям, есть много подводных камней. Если вы используете jQuery.load(...), предполагается неправильный тип содержимого (html вместо application/javascript), что может испортить вещи, помещая нежелательный <br> в ваш (scriptNode).innerText и тому подобное. Затем, если вы используете jQuery.getScript(...), загружаемый script немедленно выполняется, что может и не быть тем, что вы хотите (может испортить заказ, в котором вы хотите загрузить файлы, если у вас есть несколько из них.)
Я нашел, что лучше использовать jQuery.ajax с dataType: "text"
Я использовал эту технику Ajax в проекте с набором фреймов, где для набора фреймов и/или нескольких фреймов нужен один и тот же JavaScript, чтобы избежать повторного отправки сервером этого JavaScript несколько раз.
Вот код, протестирован и работает:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<script id="scriptData">
var scriptData = [
{ name: "foo" , url: "path/to/foo" },
{ name: "bar" , url: "path/to/bar" }
];
</script>
<script id="scriptLoader">
var LOADER = {
loadedCount: 0,
toBeLoadedCount: 0,
load_jQuery: function (){
var jqNode = document.createElement("script");
jqNode.setAttribute("src", "/path/to/jquery");
jqNode.setAttribute("onload", "LOADER.loadScripts();");
jqNode.setAttribute("id", "jquery");
document.head.appendChild(jqNode);
},
loadScripts: function (){
var scriptDataLookup = this.scriptDataLookup = {};
var scriptNodes = this.scriptNodes = {};
var scriptNodesArr = this.scriptNodesArr = [];
for (var j=0; j<scriptData.length; j++){
var theEntry = scriptData[j];
scriptDataLookup[theEntry.name] = theEntry;
}
//console.log(JSON.stringify(scriptDataLookup, null, 4));
for (var i=0; i<scriptData.length; i++){
var entry = scriptData[i];
var name = entry.name;
var theURL = entry.url;
this.toBeLoadedCount++;
var node = document.createElement("script");
node.setAttribute("id", name);
scriptNodes[name] = node;
scriptNodesArr.push(node);
jQuery.ajax({
method : "GET",
url : theURL,
dataType : "text"
}).done(this.makeHandler(name, node)).fail(this.makeFailHandler(name, node));
}
},
makeFailHandler: function(name, node){
var THIS = this;
return function(xhr, errorName, errorMessage){
console.log(name, "FAIL");
console.log(xhr);
console.log(errorName);
console.log(errorMessage);
debugger;
}
},
makeHandler: function(name, node){
var THIS = this;
return function (fileContents, status, xhr){
THIS.loadedCount++;
//console.log("loaded", name, "content length", fileContents.length, "status", status);
//console.log("loaded:", THIS.loadedCount, "/", THIS.toBeLoadedCount);
THIS.scriptDataLookup[name].fileContents = fileContents;
if (THIS.loadedCount >= THIS.toBeLoadedCount){
THIS.allScriptsLoaded();
}
}
},
allScriptsLoaded: function(){
for (var i=0; i<this.scriptNodesArr.length; i++){
var scriptNode = this.scriptNodesArr[i];
var name = scriptNode.id;
var data = this.scriptDataLookup[name];
var fileContents = data.fileContents;
var textNode = document.createTextNode(fileContents);
scriptNode.appendChild(textNode);
document.head.appendChild(scriptNode); // execution is here
//console.log(scriptNode);
}
// call code to make the frames here
}
};
</script>
</head>
<frameset rows="200pixels,*" onload="LOADER.load_jQuery();">
<frame src="about:blank"></frame>
<frame src="about:blank"></frame>
</frameset>
</html>
Если вы хотите получить доступ к атрибутам тега <script>, а не к содержимому script.js, тогда XPath вполне может быть тем, что вам нужно.
Это позволит вам получить каждый из атрибутов script.
Если это содержимое файла example.js, после чего вы можете запустить запрос AJAX для его получения.
Если атрибут src предоставляется, пользовательские агенты должны игнорировать содержимое элемента, если вам нужно получить к нему доступ из внешний script, то вы, вероятно, делаете что-то неправильно.
Обновление. Я вижу, вы добавили комментарий о том, что вы хотите кэшировать script и использовать его позже. С какой целью? Предполагая, что ваш HTTP является кэширующим, ваши потребности в кешировании, скорее всего, позаботятся обозревателем.
Я бы предположил, что ответ на этот вопрос использует свойство "innerHTML" элемента DOM. Конечно, если загружен script, вам нужно не сделать вызов Ajax для его получения.
Итак Сугендран должен быть прав (не знаю, почему он был проголосован без объяснений).
var scriptContent = document.getElementById("myscript").innerHTML;
Свойство innerHTML элемента script должно предоставить вам содержимое скриптов в виде строки, если элемент script:
olle также дает ответ, но я думаю, что он "запутался" в том, что он предположил, что его нужно сначала загрузить через ajax, и я думаю, что он имел в виду "встроенный" "вместо того, чтобы между ними.
если у вас есть js между ними, и вы можете получить к нему доступ через innerHTML.
Что касается полезности этого метода:
Я попытался использовать этот метод для регистрации ошибок на стороне клиента (из исключений javascript) после получения "undefined переменных", которые не содержатся в моих собственных сценариях (например, неправильно написанные скрипты из панелей инструментов или расширений) - поэтому я не думаю, что это такая идея выхода.
Использование DOM-привязки в стиле 2008 года скорее всего будет:
document.getElementById('myscript').getAttribute("src");
document.getElementById('myscript').getAttribute("type");
Надеюсь, вы уже используете библиотеку JavaScript...
Как получить значение атрибута src, URL-адрес, а затем использовать инструменты Ajax библиотеки, чтобы сделать запрос на этот URL-адрес и сохранить этот результат там, где вы хотите это сделать?
Конкретные детали будут различаться в зависимости от используемой библиотеки.
Не знаете, зачем вам это нужно?
Другим способом было бы удерживать script в скрытом элементе где-то и использовать Eval для его запуска. Затем вы можете запросить свойства объектов innerHtml.