Как передать ширину блока через data-атрибут?

Question

[Дмитрий]

Суть вопроса: есть полоски с атрибутом data-width, через который я хочу задать их ширину. Подскажите, как передать ширину для каждой полоски одного класса через data?

Answer 1

[Дмитрий]

Может кому пригодиться (обязательно наличие jQuery):

$('.results-survey__line').each(function(){
    $(this).width($(this).data('width'));
});

Comments

[Артур Карапетян]

Серьезно? Я дал Вам решение из двух вариантов(CSS и нативный JS)

[Alex Ander]

Артур: а что плохого в том, чтобы подключить jQuery ради такого?

Answer 2

[Артур Карапетян]

CSS:
.some-selector {
width: attr(data-width)
}
JS
document.querySelector('.some-selector').style.width=document.querySelector('.some-selector').dataset.width

Comments

[Артур Карапетян]

PS: Если нужно добавить для нескольких элементов чрез JS, тогда нужно применить цикл, например:
var div = document.querySelectorAll('.some-selector')
for(var i, i > div.length, i++) {
div[i].style.width=div[i].dataset.width
}

[Kovalsky]

Артур:

.some-selector {
    width: attr(data-width);
}

Это есть в спецификации, но CSS так не умеет и скорее всего не будет уметь. Вот что об этом пишет David Baron:

I think the main use cases for this were actually around the goal of being able to explain all of HTML's presentational behavior using CSS, something that's become less of a goal lately now that HTML5 has added a lot more behavior that would be harder to explain. So the use cases that I remember from when it was added appear, today, rather weak. Seeing other real use cases would be helpful, although filling up this bug too much will make the bug unreadable.

It's also worth pointing out that this is a pretty large change; I would say it most likely is substantially larger than CSS Variables, and probably imposes more architectural constraints on the engine, although maybe there are clever ways to do parts of it that I haven't thought of.

[Артур Карапетян]

Никита Полевой: Я не призываю использовать этот прием повсеместно, просто я написал человеку какие могут быть варианты реализации подобной задачи

[Kovalsky]

Артур: это нигде не работает, поэтому не может считаться вариантом решения.