Я пытаюсь получить getBoundingClientRect() элемента object, который я только что добавил в body, но он возвращает width и height 0. В настоящее время я исправил проблему, добавляя SVG в html, содержащий то же изображение, и установил скрытую видимость, затем получить ширину и высоту от этого. Размер объекта представляет собой процент от размера окна, поэтому я не могу знать его заранее.
let bulletSVG = document.createElement("object");
bulletSVG.setAttribute("class", "bullet");
bulletSVG.setAttribute("type", "image/svg+xml");
bulletSVG.setAttribute("data", "imgs/bullet.svg");
document.body.appendChild(bulletSVG);
console.info(bulletSVG.getBoundingClientRect());
Я бы не стал добавлять SVG в тело только для того, чтобы получить ширину и высоту. Как я могу сделать?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Мое обоснованное предположение состоит в том, что браузер еще не знает размер изображения, поскольку вы не ждете полной загрузки изображения. Я бы сделал что-то вроде этого:
const load = (obj) =>
new Promise(resolve => obj.onload = resolve);
async function addSVG() {
let bulletSVG = document.createElement("object");
bulletSVG.setAttribute("class", "bullet");
bulletSVG.setAttribute("type", "image/svg+xml");
bulletSVG.setAttribute("data", "imgs/bullet.svg");
document.body.appendChild(bulletSVG);
await load(bulletSVG);
console.info(bulletSVG.getBoundingClientRect());
}
addSVG();
ОБНОВИТЬ Если ваш браузер не поддерживает обещания, и вы не можете/не хотите использовать транспилятор (например, Babel 7); вы заставляете его работать, используя непосредственно обработчик событий, хотя это будет не так элегантно:
function addSVG() {
let bulletSVG = document.createElement("object");
bulletSVG.setAttribute("class", "bullet");
bulletSVG.setAttribute("type", "image/svg+xml");
bulletSVG.setAttribute("data", "imgs/bullet.svg");
document.body.appendChild(bulletSVG);
bulletSVG.onload = function() {
console.info(bulletSVG.getBoundingClientRect());
}
}
Спасибо! Попробую реализовать ваше решение.
Спасибо. Я должен заставить это работать в IE11, но, похоже, промисы не поддерживаются.