Как узнать ширину и высоту элемента path с помощью javascript?

Question

[Дима Паутов]

Мне нужно узнать размер элемента path в моём svg. Но беда в том, что используя метод width(), то значение я получаю 0

Answer 1

[teotlu]

clientWidth не работает, проверил.
Зато сработает вот это. На всякий случай тоже проверил, работает.

Comments

[Дима Паутов]

А можно ваш пример? У меня не срабатывает, ошибка
Вот пример: console.log(el.getBoundingClientRect). Пишет: el.getBoundingClientRect is not a function

[Александр]

аналогично jsfiddle.net/2prybs45

[Дима Паутов]

lebonnet: такой вопрос, почему он через $('path') не хочет, а document.getElementsByTagName('path') хочет?

[Денис Инешин]

Дима Турков: $('path') возвращает jQuery объект, а не ноду. Чтобы из jQuery объекта эту ноду выдрать, нужно сделать так: $('path')[0]

[Александр]

Дима Турков: Денис Инешин: у меня не получилось ни через jQuery, ни нативно, у кого заработало покажите пример.

[Евгений Петров]

Денис Инешин: Самое удивительное, что getElementsByTagName вернёт коллекцию, из которой нужно дёргать узел или по индексу, или по имени...

[Денис Инешин]

lebonnet: вот пример на чистом JS: jsfiddle.net/IonDen/refm825y

[Александр]

Евгений Петров: точно, блин там же массив! jsfiddle.net/2prybs45/1

[teotlu]

jsfiddle.net/ce0twtgu/2 — вот пример. Выдрал из какого-то своего svg кусок.

[Евгений Петров]

lebonnet: Только getBoundingClientRect и getClientRects — трудоёмкие операции. Выполняйте запрос 1 раз, после чего уже обращаетесь к свойствам.

[Евгений Петров]

lebonnet: И getElementsByTagName вернёт коллекцию, а не массив. Похоже, но не одно и то же.

[Дима Паутов]

Многое узнал. Большое спс всем!

Answer 2

[Дмитрий]

попробуй $('svg#test').get(0).clientWidth должно сработать

Comments

[Дима Паутов]

Я исправил вопрос, мне не сам SVG элемент нужен, а его дочерние, в моем случае это элемент path!

[Дмитрий]

Дима Турков: селектор просто для примера. Так же можно выбрать path и от него уже get(0).clientWidth

[teotlu]

Дмитрий: это не работает.