Как добавить javascript на кнопку click async

Question

Чтобы добавить сценарий динамически, нам нужно создать элемент сценария и добавить свойство src элемента сценария и, наконец, добавить элемент сценария в тег заголовка (или любой другой тег). Но поведение синхронно, и страница блокируется до полного загрузки javascript. Я хочу знать, есть ли какая-нибудь возможная работа, по которой я могу встроить javascript асинхронно, не используя xhr.

var script = document.createElement('script'); 
script.type = 'text/javascript'; 
script.src = 'urlofthescript'; 
$("#someElement").append(script); 
//the above line blocks the UI until it gets loaded. Why? 

Answer 1

<script src="..."> тег всегда будет синхронным, если вы не используете async attribute. Но если вы вставляете <script>code goes here</script>, выполнение начинается без задержки (как только вы откажетесь от потока JS). Поэтому создайте свой код в строке или загрузите его через AJAX, затем document.createTextNode(code), document.createElement('script'), appendChild код в скрипт, затем скрипт на документ. Другая возможность - использовать некоторые превосходные модульные системы, которые появились в последнее время, такие как RequireJS, которые определяют все это для вас.