Как загрузить код JavaScript в HTML-файл во время выполнения? - PullRequest
Новая
       17

Как загрузить код JavaScript в HTML-файл во время выполнения?

7 голосов
/ 27 января 2012

Позвольте мне спросить, возможно ли загрузить код javascript в html-файл во время выполнения.Например, поместите текстовое поле для ввода местоположения файлов сценария и кнопку формы для запуска загрузки файлов сценария.

Заранее спасибо.

Ответы [ 4 ]

20 голосов
/ 27 января 2012

Вставьте это в одно нажатие этой кнопки (исправьте URL в 3-й строке): 

var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", "url to the script file here");
document.getElementsByTagName("head")[0].appendChild(script);

Этот сценарий начнет загружаться сразу после выполнения строки 4, и, как только он будет загружен, он будет выполняться или использоваться иным образом.

8 голосов
/ 27 января 2012

Да, метод getScript jQuery делает это тривиальным: 

//on button click event:
$.getScript(urlOfScript);

В качестве альтернативы, используя только собственные методы javascript: 

//on button click event:
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'urlOfScript';
head.appendChild(script);
1 голос
/ 27 января 2012

Все хорошие ответы выше. Вы также можете загрузить JS через AJAX, как любой другой фрагмент HTML. Краткий пример:

start.html

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
    <a href="#" onclick="$('#result').load('start.js'); return false;">start</a>
    <div id="result"></div>
</body>
</html>

start.js

<script type="text/javascript">
    alert('Hello world!');
</script>

Вам не нужен jquery для ajax - я просто использовал его как быстрое подтверждение концепции.

0 голосов
/ 18 сентября 2017

Здесь также есть метод jquery для достижения того же. 

let src = 'http://www.example.com/dosome/afsddfa';
$('<script>').attr(
{
   src: src,
   type: 'text/javascript'
}).appendTo('body');

Он создаст элемент скрипта и добавит его в тело.

Вы также можете использовать .appendTo('head').

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...