Как можно изменить страницу через подключенный к нему скрипт

Есть скрипт main.js. Как сделать так, чтобы main.js, мог подключать в страницу, в которую он сам же и подключен? Скажем есть сайт first.com. К главной странице подключен main.js

<head>
    <script src="cdn.example.com/main.js"></script>
</head>

Что нужно написать в main.js, чтобы он добавил другой файл на главную страницу first.com. Чтобы в итоге стало скажем это

<head>
    <script src="cdn.example.com/main.js"></script>
    <script src="cdn.example.com/ad.js"></script>
</head>

Ответы (1 шт):

Автор решения: Stepan Kasyanenko

Внутри main.js создаешь теги script, потом их вставляешь в документ.

Небольшой пример. Не идеальный, надо добавить обработку ошибок, можно перевести на промисы и async\await.

function addScriptLodash() {
  addScript('https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js', function() {
    console.log('lodash loaded');
    checkLodash();
  });
}

function addScript(url, callback) {
  const script = document.createElement('script');
  script.onload = callback;
  script.src = url;
  document.head.appendChild(script);
}

function checkLodash() {
  try {
    console.log(_.VERSION);
  } catch (e) {
    console.warn(e.message);
  }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onclick="addScriptLodash()">add lodash</button>
<button onclick="checkLodash()">check lodash</button>

→ Ссылка