Как вывести список всех пар имен/значений переменных CSS из элемента ⇐ CSS

[Anonymous]

У меня есть библиотека JS, и у меня возникла проблема: я создаю временный элемент для расчета размера символа с использованием моноширинного шрифта. Сейчас я копирую встроенный стиль, но мне нужны все стили из оригинала, включая переменные CSS. Я не хочу клонировать элемент, потому что внутри есть элементы, которые мне не нужны. Также элемент может иметь идентификатор, установленный пользователем, но не уверен, как это будет вести себя, когда будет два элемента с одинаковым идентификатором, поэтому было бы лучше (я думаю) просто скопировать каждый стиль в новый временный элемент.
У меня есть код, основанный на следующем:

• Доступ к пользовательскому свойству CSS (также известному как переменная CSS) через JavaScript
• Установить вычисляемый стиль JavaScript для одного элемента в другом

Мой код выглядит следующим образом:

Код: Выделить всё

function is_valid_style_property(key, value) {
//checking that the property is not int index ( happens on some browser
return typeof value === 'string' && value.length && value !== parseInt(value);
}

function copy_computed_style(from, to) {
var computed_style_object = false;
computed_style_object = from.currentStyle || document.defaultView.getComputedStyle(from, null);

if (!computed_style_object) {
return;
}
Object.keys(computed_style_object).forEach(function(key) {
var value = computed_style_object.getPropertyValue(key);
if (key.match(/^--/)) {
console.log({key, value}); // this is never executed
}
if (is_valid_style_property(key, value)) {
to.style.setProperty(key, value);
}
});
}

проблема в том, что getComputedStyle не возвращает переменные CSS. Есть ли другое решение, чтобы получить список переменных CSS, примененных к элементу?

Мне нужны переменные CSS, потому что у меня есть CSS, который применяется к элементу, который находится внутри моего временного элемента. , основанный на переменных CSS. Является ли клонирование узла единственным способом копирования переменных CSS из одного элемента в другой?

РЕДАКТИРОВАТЬ:

это не дубликат, поскольку переменную css также можно установить встроенной не только в таблицу стилей для каждого класса. И стиль моего элемента может быть добавлен с помощью самых разных селекторов CSS, о которых я не могу знать.

Подробнее здесь: https://stackoverflow.com/questions/540 ... om-element