Передайте переменные в JavaScript через атрибут SRC

Question

В моем HTML-файле я ссылался на JS с помощью:

src="myscript.js?config=true"

Может ли мой JS непосредственно прочитать значение этого var, как это?

alert (config);

Это не работает, и консоль ошибок Firefox говорит: "Конфигурация не определена". Как мне прочитать переменные, переданные через атрибут src в файл JS? Это так просто?

Answer 1

<script>
var config=true;
</script>
<script src="myscript.js"></script>

Вы не можете передавать переменные в JS так, как вы пытались. Тег SCRIPT не создает объект Window (который имеет строку запроса) и не является кодом на стороне сервера.

Answer 2

Да, вы можете, но вам нужно знать точное имя файла скрипта в скрипте:

var libFileName = 'myscript.js',
    scripts = document.head.getElementsByTagName("script"), 
    i, j, src, parts, basePath, options = {};

for (i = 0; i < scripts.length; i++) {
  src = scripts[i].src;
  if (src.indexOf(libFileName) != -1) {
    parts = src.split('?');
    basePath = parts[0].replace(libFileName, '');
    if (parts[1]) {
      var opt = parts[1].split('&');
      for (j = opt.length-1; j >= 0; --j) {
        var pair = opt[j].split('=');
        options[pair[0]] = pair[1];
      }
    }
    break;
  }
}

Теперь у вас есть переменная 'options', в которой переданы аргументы. Я не проверял его, я немного изменил его с http://code.google.com/p/canvas-text/source/browse/trunk/canvas.text.js где он работает.

Answer 3

Возможно, вы видели, что это сделано, но на самом деле JS-файл предварительно обрабатывается на стороне сервера с использованием PHP или другого языка. Код на стороне сервера напечатает / отобразит javascript с установленными переменными. Я видел сценарий рекламной службы, которая делала это раньше, и это заставило меня посмотреть, можно ли это сделать обычными старыми, но не может.

Answer 4

Вам нужно использовать Javascript, чтобы найти атрибут src скрипта и проанализировать переменные после "?". Используя каркас Prototype.js, он выглядит примерно так:

var js = /myscript\.js(\?.*)?$/; // regex to match .js

var jsfile = $$('head script[src]').findAll(function(s) {
    return s.src.match(js);
}).each(function(s) {
    var path = s.src.replace(js, ''),
    includes = s.src.match(/\?.*([a-z,]*)/);
    config = (includes ? includes[1].split('=');
    alert(config[1]); // should alert "true" ??
});

Мои навыки Javascript/RegEx ржавые, но это общая идея. Разорвано прямо из файла scriptaculous.js!

Answer 5

Однако ваш скрипт может найти свой собственный узел скрипта, изучить атрибут src и извлечь любую информацию, которая вам нравится.

  var scripts = document.getElementsByTagName ('script');
  for (var s, i = scripts.length; i && (s = scripts[--i]);) {
    if ((s = s.getAttribute ('src')) && (s = s.match (/^(.*)myscript.js(\?\s*(.+))?\s*/))) {
      alert ("Parameter string : '" + s[3] + "'");    
      break;
    } 
  }

Answer 6

Использование глобальных переменных не является таким чистым или безопасным решением, вместо этого вы можете использовать атрибуты data-X, это чище и безопаснее:

<script type="text/javascript" data-parameter_1="value_1" ... src="/js/myfile.js"></script>

Из myfile.js вы можете получить доступ к параметрам данных, например, с помощью jQuery:

var parameter1 = $('script[src*="myfile.js"]').data('parameter_1');

Очевидно, что "myfile.is" и "parameter_1" должны совпадать в двух источниках;)

Answer 7

Вы можете сделать это с помощью однострочного кода:

new URL($('script').filter((a, b, c) => b.src.includes('myScript.js'))[0].src).searchParams.get("config")

Answer 8

Проще передать аргументы без имен, как при вызовах функций.

В HTML:

      <script src="abc.js" data-args="a,b"></script>

Затем в JavaScript:

      const args=document.currentScript.dataset.args.split(',');

Теперь args содержит массив ['a','b'].

Answer 9

Независимо от того, СЛЕДУЕТ ли это делать или нет, это справедливый вопрос, но если вы хотите это сделать, http://feather.elektrum.org/book/src.html действительно показывает, как это сделать. Предполагая, что ваш браузер блокирует при рендеринге тегов скрипта (в настоящее время это правда, но может не быть будущим), рассматриваемый скрипт всегда является последним скриптом на странице до этого момента.

Затем с использованием некоторого фреймворка и плагина, таких как jQuery и http://plugins.jquery.com/project/parseQuery это становится довольно тривиальным. Удивлен, что для этого еще нет плагина.

В некоторой степени связаны унизительные теги сценария Джона Резига, но они запускают код ПОСЛЕ внешнего сценария, а не в рамках инициализации: http://ejohn.org/blog/degrading-script-tags/

Кредиты: передача параметров в файлы JavaScript, передача параметров в файлы JavaScript