Присвоить div-у атрибут class или style и вписать в них данные

@SanychBY · Регистрация: 04.06.2013

Студворк — интернет-сервис помощи студентам

Здравствуйте
Есть див

HTML5
1
<div id='div' contenteditable="true">///</div>

Необходимо присвоить ему атрибут class или style и вписать в них данные. Притом это должно работать для всех атрибутов. Подскажите как это реализовать.
Спасибо.

@xenohunter · 03.09.2014, 01:02

SanychBY, например, так:

JavaScript
1
2
3
4
5
var div = document.getElementById('div');
div.className = 'div-class-name';
div.style.width = '300px';
div.style.backgroundColor = 'red';
// и так далее

Если свойство пишется через дефис (например, background-color), то дефис убирается, а символ после него становится прописным (backgroundColor).

@SanychBY · 03.09.2014, 01:12 **[ТС]**

xenohunter, вы написали для каждого по отдельности, а мне нужно для всех одна функция. Универсальный метод так сказать

@xenohunter · 03.09.2014, 01:18

SanychBY, для каждого атрибута? Или для каждого элемента? Для атрибутов можно использовать setAttribute:

JavaScript
1
2
var div = document.getElementById('div');
div.setAttribute('class', 'div-class-name');

Для удаления можно использовать метод removeAttribute (с одним аргументом - именем атрибута).

@SanychBY · 03.09.2014, 11:09 **[ТС]**

Сообщение от xenohunter

Или для каждого элемента?

А setAttribute работает не со всеми элементами?

@xenohunter · 03.09.2014, 13:04

SanychBY, вы объясните понятнее, что вам нужно. Работает со всеми, но по отдельности. Если вам нужно для всех div одинаковые атрибуты сделать, то можете написать так, к примеру:

JavaScript
1
2
3
4
5
6
var divs = document.getElementsByTagName('div'),
    len = divs.length,
    i;
 
for (i = 0; i < len; i++)
    divs[i].setAttribute('attribute-name', 'attribute-value');

@Thisman · 03.09.2014, 14:30

SanychBY, ну вот "универсал"

JavaScript
1
2
3
4
5
6
7
8
// Необходимо будет подключить JQ
function setAttribute(selector,attribute,value){
     $.each($(selector),function (i,el) {
           $(el).atrr(attribute,value);
     }
}
 
// Если надо на чистом, можно и на чистом написать

Новые блоги и статьи Все статьи Все блоги /
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .	Использование значений реквизитов справочника в документе, с определенными условиями и правами Maks 07.04.2026 1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .
Доступность команды формы по условию Maks 07.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: сделать доступной кнопку (команда формы "ЗавершитьСписание") при. . .	Уведомление о неверно выбранном значении справочника Maks 06.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "НарядПутевка", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если в документе выбран неверный склад. . .	Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .

@SanychBY 39 / 46 / 3 Регистрация: 04.06.2013 Сообщений: 1,532
	03.09.2014, 01:12 [ТС]
	xenohunter, вы написали для каждого по отдельности, а мне нужно для всех одна функция. Универсальный метод так сказать 0