4 / 4 / 5
Регистрация: 30.08.2012
Сообщений: 155
1

Связь кода JS и CSS

11.07.2015, 15:42. Показов 1451. Ответов 7
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Не могу понять, как сделать следующее. У меня есть код html, с помощью него пользователь выбирает в элементе radio один из вариантов закрашивания фона (цвет). После этого нажимает кнопку подтверждения. Есть отдельно код с текущим CSS-стилем и отдельно JS код, в котором есть другие инструкции, не относящиеся к данной проблеме. В JS у меня есть связь с кодом html (с событием кликания на кнопку подтверждения),т.е. с помощью alert() выводится цвет, который выбрал пользвоатель. Но как тут применить CSS, как сделать так, чтобы в зависимости от выбранного цвета этим цветом закрашивался фон(background-color)? Вопрос, возможно, глупый, но я совсем новичок в вебе. Заранее спасибо

Добавлено через 10 минут
Т.е. как сделать это в стиле
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
switch(выбранный цвет)
{
   case "green" :
      background-color:#(green);
      break;
case "blue" :
      background-color:#(blue);
      break;
case "black" :
      background-color:#(black);
      break;
}
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
11.07.2015, 15:42
Ответы с готовыми решениями:

Спарсить текст кода css и/или less файла подключаемого через тег link
Хорошо ответьте пока что на второй вопрос - как спарсить текст кода css и/или less файла...

связь html и css
начал изучать css такой простенький пример, но я не понимаю почему он у меня не работает: ...

C++ Связь управляемого кода с обычным
Всем добрый день. Пишу графическое приложение (редактор карт для игры) на DirectX9. Всей...

Оптимизация CSS-кода
Есть пара классов: .class-1{ width: 50px; height: 100px; background: url(picture.png); }...

7
3325 / 2845 / 1423
Регистрация: 15.01.2014
Сообщений: 6,170
11.07.2015, 15:52 2
Лучший ответ Сообщение было отмечено Liori как решение

Решение

Liori, пример в песочнице
HTML5
1
2
3
<input type="radio" name="bgcolor" value="#060">Зеленый<br>
<input type="radio" name="bgcolor" value="#036">Синий<br>
<input type="radio" name="bgcolor" value="#f00">Красный<br>
Javascript
1
2
3
4
5
6
var inp = document.getElementsByName('bgcolor');
for(var i = 0; i < inp.length; i++) {
    inp[i].addEventListener('change', function(){
        document.body.style.backgroundColor = this.value;
    }, false);
}
Добавлено через 3 минуты
Допустимо писать некоторые значения цветов на английском. При этом, менять что-то в JS не нужно
1
4 / 4 / 5
Регистрация: 30.08.2012
Сообщений: 155
11.07.2015, 16:13  [ТС] 3
Lazy_Den, таким образом, как я понимаю, можно изменять значение любого свойства? Не только цвет?
И нельзя ли это как-то сделать, подключая в код JS скрипт CSS?
Типа
Javascript
1
2
3
4
5
6
<style type="text/css">
   body
   {
      background-color:#000000;
   }
</style>
0
3325 / 2845 / 1423
Регистрация: 15.01.2014
Сообщений: 6,170
11.07.2015, 16:16 4
Цитата Сообщение от Liori Посмотреть сообщение
можно изменять значение любого свойства?
Да.
Цитата Сообщение от Liori Посмотреть сообщение
как-то сделать, подключая в код JS скрипт CSS?
Даже представляю себе сложно подобное. В JS можно добавлять/менять/удалять классы у элементов, а стили классов, могут быть заранее прописаны в css-файле.
0
89 / 87 / 49
Регистрация: 09.10.2014
Сообщений: 571
11.07.2015, 22:12 5
Liori, давай по порядку от а до б двигайся, а то так ты с форума не вылезешь никогда ( не в обиду )
https://learn.javascript.ru
0
4 / 4 / 5
Регистрация: 30.08.2012
Сообщений: 155
11.07.2015, 23:27  [ТС] 6
sash, хех Я понимаю, что желательно двигаться плавно от одной темы к другой - читаю довольно хорошие книги, видеоуроки смотрю, придумываю сама себе мини-задания. Но вот пришла в голову идея и просто невероятно захотелось её реализовать (только что таки это сделала, небольшая проблемка только с регулярками ещё осталась)
0
89 / 87 / 49
Регистрация: 09.10.2014
Сообщений: 571
12.07.2015, 00:03 7
Какая, может, помогу
0
4 / 4 / 5
Регистрация: 30.08.2012
Сообщений: 155
12.07.2015, 00:18  [ТС] 8
sash, вот я создала темы
Не работает правильно рег.выражение
Как запомнить часть рег.выражения?

Хочу просто чтобы все данные вводились в одном поле (а не в 3-х, как сейчас, и с помощью регулярок уже проверялась их корректность), но мой код не работает
0
12.07.2015, 00:18
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
12.07.2015, 00:18
Помогаю со студенческими работами здесь

Оптимизация css кода
Здравствуйте! Есть записи на сайте, которые требуют индивидуальную визуализацию. Т.е.,...

Удалить из кода подключение css
Доброго времени суток. Прошу сильно не пинать, я в программировании не специалист :-) Есть...

Изменение кода с XPath на CSS
Здравствуйте! Для примера написал вот такой скрипт с использованием XPath: &lt;?php $html =...

Оптимизация кода (HTML, CSS, JS)
Доброго времени суток уважаемые! Недавно задался себе вопросом: как оптимизировать страницу, в...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
8
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru