Вызов SVG-спрайтов с проблемой Ajax

#javascript #jquery #ajax #svg

Вопрос:

Я пытаюсь вызвать разные внешние SVG-спрайты на одной HTML-странице. Если я придерживаюсь одного, все работает отлично, как только я хочу вызвать разные SVG-спрайты, я получаю только одну загрузку. Таким образом, по сути, он загружает только один спрайт и игнорирует остальные. Я что-то упускаю в синтаксисе здесь?

Я использую следующий код ajax // Я новичок, поэтому я уверен, что здесь я совершаю ужасную ошибку 🙂

 <script>
var ajax = new XMLHttpRequest();
ajax.open("GET", "sprite1", "sprite2", "sprite3", true);
ajax.send();
ajax.onload = function(e) {
var div = document.createElement("div");
div.innerHTML = ajax.responseText;
document.body.insertBefore(div, document.body.childNodes[0]);
}
</script>

Затем в HTML
Я использую это

 <svg class="sprite1">
  <use xlink:href="#icon-name"></use>
</svg>

1. Возможно, я не лучший источник, но проблема, возможно, в том, что он загружает их по частям, попробуйте e.ondata() в функции onload посмотреть, сможете ли вы получить их все.

2. @Scurgery Как ты хочешь это написать? ajax.onload = function(e.ondata()) {

Ответ №1:

Извините за использование ответа для этого, но это немного более длинный код.

 var ajax = new XMLHttpRequest();
ajax.open("GET", "sprite1", "sprite2", "sprite3", true);
ajax.send();
ajax.onload = function(e) {
  e.ondata = (chunk) => {
    console.log(chunk);
  }
  var div = document.createElement("div");
  div.innerHTML = ajax.responseText;
  document.body.insertBefore(div, document.body.childNodes[0]);
}

Это всего лишь летящая мысль, но может сработать.

1. Спасибо, чувак! к сожалению, я попробовал, и он показывает то же самое, загружает элементы sprite 1, но игнорирует два других спрайта.

2. Извини, братан: ( … Другая мысль… вы уверены, что можете использовать open для одновременной загрузки нескольких файлов? Я никогда не использовал его таким образом.

3. Спасибо, чувак, понятия не имею! Я здесь не эксперт: D надеюсь, сообщество поможет с этой проблемой.