Зацыклить переключатель

@soulilya · Регистрация: 08.10.2013

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

Помогите пожалуйста со скриптом. В одну сторону работает, то есть включается, а как сделать, чтобы выключалась.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<head>
<title>My Web Page</title>
<script>
 
    function changer(){
        document.getElementById('image').src="images/image.PNG";
            document.getElementById('bodys').style.backgroundColor='red';
};
 
</script>
</head>
<body id="bodys" style="background-color:yellow;">
<img id ="image" src="images/image(2).PNG" onclick="changer();">
 
</body>

@Опан · 30.11.2013, 00:34

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
a=0;
function changer(){
    if(a==0){
        document.getElementById('image').src="images/image.PNG";
        document.getElementById('bodys').style.backgroundColor='red';
    }
    else{
        document.getElementById('image').src="images/image(2).PNG";
        document.getElementById('bodys').style.backgroundColor='yellow';
        
    }
    a++;
    if(a==2){a=0};
}
 </script>

@soulilya · 30.11.2013, 02:17 **[ТС]**

Благодарю) Это так просто было, оказывается)))

@kalabuni · 30.11.2013, 05:27

1. тегу <body> незачем назначать id, ибо к этому тегу можно обратиться напрямую document.body
(таких тегов с собственными именами-ссылками всего три -- <body>, <title>, <!doctype> -- легко запомнить)

2. в предложенном коллегой Опан варианте в качестве флага используется свойство окна window.a
это, ИМХО, тоже лишнее, ибо в самом коде кнопки уже имеется такой "флаг", а именно - значение атрибута SRC

потому предложу следующий вариант:

JavaScript
1
2
3
4
5
6
function changer ()
{
with (document) var O = getElementById ('image'), BS = body.style;
if (O.src.indexOf ('/image(2).') < 0) O.src = 'images/image(2).PNG', BS.backgroundColor = 'yellow';
else O.src = 'images/image.PNG', BS.backgroundColor = 'red';
}

@Опан · 30.11.2013, 14:29

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

можно обратиться напрямую document.body

Моно обратиться ещё прямее : document.bgColor="red"; но это работает, если из тега <body> убрать style="background-color:yellow;"

@soulilya · 30.11.2013, 16:23 **[ТС]**

Кстати про стили. Он может менять свойства оформленные в шапке <style></style> ??? Я пробовал, чет не получилось. У меня подозрение, что он может их менять только если, стили подключены по внешней ссылке. это так?

@Опан · 30.11.2013, 16:50

И то, что в шапке, тоже меняет, только так : document.body.style.backgroundColor='red ';

@kalabuni · 30.11.2013, 19:31

Сообщение от Опан

Моно обратиться ещё прямее

вы не поняли

из всех существующих тегов только три тега имеют собственные имена-ссылки:
-- document.body
-- document.title
-- document.doctype

в том числе и потому, что эти теги должны быть единственными на странице

поэтому:
-- давать этим тегам идентификаторы id="значение" и обращаться к ним с помощью метода document.getElementById ('значение_id')
-- или же обращаться к ним через, например, коллекцию document.getElementsByTagName ('body') [0]
оно, конечно, можно... но, ИМХО, как-то это глупо выглядит

@Опан · 01.12.2013, 00:47

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

вы не поняли

Во всяком случае где-то я урвал такой пример. При чём, уже давненько. Может сейчас это считается устаревшим ?

Добавлено через 39 минут
Оказывается, вот где описание : bgColor - свойство объекта document

@kalabuni · 01.12.2013, 03:02

Сообщение от Опан

Во всяком случае где-то я урвал такой пример.

опять вы меня не поняли

я не о фоне написал
я о теге <body> написал
и написал, что не надо тегу <body> устанавливать id - это непрофессионально

а что до свойства bgColor объекта document - да, существует такое
но мало кем и мало когда используется

@Опан · 01.12.2013, 03:08

Да, действительно не догнал. На счёт присвоения ID я согласен.

@soulilya · 02.12.2013, 18:46 **[ТС]**

Про body не знал, спасибо.

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@soulilya 2 / 2 / 1 Регистрация: 08.10.2013 Сообщений: 74
	30.11.2013, 02:17 [ТС]
	Благодарю) Это так просто было, оказывается))) 0

@soulilya 2 / 2 / 1 Регистрация: 08.10.2013 Сообщений: 74
	30.11.2013, 16:23 [ТС]
	Кстати про стили. Он может менять свойства оформленные в шапке <style></style> ??? Я пробовал, чет не получилось. У меня подозрение, что он может их менять только если, стили подключены по внешней ссылке. это так? 0

@Опан Юзер с абсолютным слухом 709 / 489 / 195 Регистрация: 17.12.2010 Сообщений: 1,428
	30.11.2013, 16:50
	И то, что в шапке, тоже меняет, только так : document.body.style.backgroundColor='red '; 0

@Опан Юзер с абсолютным слухом 709 / 489 / 195 Регистрация: 17.12.2010 Сообщений: 1,428
	01.12.2013, 03:08
	Да, действительно не догнал. На счёт присвоения ID я согласен. 0

@soulilya 2 / 2 / 1 Регистрация: 08.10.2013 Сообщений: 74
	02.12.2013, 18:46 [ТС]
	Про body не знал, спасибо. 0