мета-данные страницы
  •  
Загрузка не удалась. Возможно, проблемы с правами доступа?

Различия

Показаны различия между двумя версиями страницы.

Ссылка на это сравнение

Предыдущая версия справа и слеваПредыдущая версия
Следующая версия		Предыдущая версия
javascript:ex [09/11/2017 12:08] – [Урок 5.1: Создаем свой спойлер] vlasovjavascript:ex [09/11/2017 13:28] (текущий) – [Урок 2.1: ввод-вывод из полей формы] vlasov
Строка 174: Строка 174:
 }; };
 </SCRIPT> </SCRIPT>
 +</code>
 +
 +В заключение темы стоит отметить, что современным способом вывода отладочной информации является использование ''console'':
 +
 +<code javascript>
 + console.log("var =",  myvar);
 </code> </code>
  
Строка 376: Строка 382:
 function spoiling() { function spoiling() {
   var nxt = getNext(this);   var nxt = getNext(this);
-  while ( nxt.className != "spoiler" ) {nxt = getNext(this)};+  while ( nxt.className != "spoiler" ) {nxt = getNext(nxt)};
   console.log(nxt.id, "check: ",  nxt.style.display);   console.log(nxt.id, "check: ",  nxt.style.display);
   if (nxt.style.display == "none")  {nxt.style.display = "block"; console.log("set=",nxt.style.display); return};   if (nxt.style.display == "none")  {nxt.style.display = "block"; console.log("set=",nxt.style.display); return};
Строка 423: Строка 429:
       nxt.style.display = "none";       nxt.style.display = "none";
 </code> </code>
-где самое главное для нас -- скрытое по умолчанию состояние спойлера: <nowiki>nxt.style.border = "dotted black"</nowiki>+где самое главное для нас -- скрытое по умолчанию состояние спойлера: ''<nowiki>nxt.style.border = "dotted black"</nowiki>'' 
 + 
 +И, наконец, рассмотрим функцию-обработчик клика, которая и осуществляет работу спойлера. 
 +Строки вроде таких 
 +<code javascript> 
 +  var nxt = getNext(this); 
 +  while ( nxt.className != "spoiler" ) {nxt = getNext(nxt)}; 
 +</code> 
 +мы уже обсуждали. 
 + 
 +Команда 
 +<code javascript> 
 +  console.log("check: ",  nxt.style.display); 
 +</code> 
 +позволяет нам осуществить запись в лог значения ''nxt.style.display''. 
 +Наконец, проверяем 
 +<code javascript> 
 +  if (nxt.style.display == "none")  {nxt.style.display = "block"; console.log("set=",nxt.style.display); return}; 
 +  if (nxt.style.display == "block" || !nxt.style.display) {nxt.style.display = "none";  console.log("set=",nxt.style.display)}; 
 +</code> 
 +состояние значения ''nxt.style.display'' и соответственно переобпредляем это значение на противополжное (отдельная забота о случае, если pyfxtybt ''nxt.style.display'' не определено).
  
 +Код базируется на примерах, взятых из книги Резинга, создателя пакета ''jquery''; разность стилей в выполнении однотипных задач определяется ленью и забывчивостью...
 ===== Урок 6: динамическое изменение картинок и события задержки ===== ===== Урок 6: динамическое изменение картинок и события задержки =====