Получить атрибут данных тега script?

Ответ 1

Для современных браузеров, поддерживающих html5, вы можете использовать document.currentScript, чтобы получить текущий элемент script.

В противном случае используйте querySelector(), чтобы выбрать свой script элемент id или атрибут.

Обратите внимание, что мы не используем атрибут src, потому что это может быть хрупким, если вы поставляете CDN или с различиями между средами разработки и производства.

embed.js

(function(){
    // We look for:
    //  A `script` element
    //  With a `data-id` attribute
    //  And a `data-name` attribute equal to "MyUniqueName"
    var me = document.querySelector('script[data-id][data-name="MyUniqueName"]');
    var id = me.getAttribute('data-id');
})();

В хосте html:

<script async 
  data-id="p3PkBtuA" 
  data-name="MyUniqueName" 
  src="//example.com/embed.js">
</script>

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

Обратите внимание, что я лично data-id мог бы выбрать script вместо передачи данных и поместить уникальные данные в более описательный тег:

<script async 
  data-id="MyUniqueName" 
  data-token="p3PkBtuA" 
  src="//example.com/embed.js">
</script>

который позволит мне использовать следующее:

var token = document
  .querySelector('script[data-id="MyUniqueName"][data-token]')
  .getAttribute('data-token');

Ответ 2

Этот embed.js отображается в DOM, поэтому у вас есть полный доступ к нему. Включите его id и используйте document.getElementById querySelctorAll или getElementsByTagName

В вашем embed.js у вас может быть что-то вроде:

  var scripts = document.getElementsByTagName('script');
  for(var i = 0, l = scripts.length; i < l; i++){
    if(scripts[i].src === '//example.com/embed.js'){
      alert(scripts[i].getAttribute('data-id'));
      break;
    }
  }

Вы получаете идею

Ответ 3

Внутри этого файла embed.js, как я могу получить значение атрибута data-id?

Вам придется проанализировать DOM и найти соответствующий тег <script>, а затем извлечь атрибуты из него. Взгляните на document.getElementsByTagName, который позволит вам получить все элементы <script> на текущей странице. Затем проведите по массиву результатов, возвращаемому этим методом, сопоставьте правильный элемент script, используя атрибут src, а затем прочитайте другие интересующие вас атрибуты.

var scripts = document.getElementsByTagName('script');
for (var i = 0; i < scripts.length; i++) {
    var script = scripts[i];
    // you might consider using a regex here
    if (script.getAttribute('src') == '//example.com/embed.js') {
        // we've got a match
        var dataId = script.getAttribute('data-id');
    }
}

Ответ 4

var attributeValue = Array.prototype.slice.apply(document.scripts).filter(
     function(script){
         return script.src.indexOf('script.source.com/big/') > -1;
     })[0].attributes["atrributeName"].value;

где script тег <sript src="www.script.source.com/big/dud/baa.js" atrributeName="some value"><script>

Ответ 5

for (var i = 0; i < scripts.length; i++) {
    var script = scripts[i];
    if (script.getAttribute('src') == '//example.com/embed.js') {
        alert(script.dataset.id);
    }
}