minor fixes

This commit is contained in:
Ilya Kantor 2015-05-22 21:07:46 +03:00
parent 6bf5977407
commit a592e89fdb
20 changed files with 184 additions and 96 deletions

View file

@ -272,11 +272,11 @@ div.parentNode.insertBefore(div2, div.nextSibling);
<dl>
<dt>`parentElem.removeChild(elem)`</dt>
<dd>Удаляет `elem` из списка детей `parentElem`.</dd>
<dt>`parentElem.replaceChild(elem, currentElem)`</dt>
<dd>Среди детей `parentElem` заменяет `currentElem` на `elem`.</dd>
<dt>`parentElem.replaceChild(newElem, elem)`</dt>
<dd>Среди детей `parentElem` удаляет `elem` и вставляет на его место `newElem`.</dd>
</dl>
Оба этих метода возвращают удаленный узел. Если нужно, его можно вставить в другое место DOM тут же или в будущем.
Оба этих метода возвращают удаленный узел, то есть `elem`. Если нужно, его можно вставить в другое место DOM тут же или в будущем.
[smart]
Если вы хотите *переместить* элемент на новое место -- не нужно его удалять со старого.
@ -399,13 +399,11 @@ div.parentNode.insertBefore(div2, div.nextSibling);
<li>`parent.appendChild(elem)`</li>
<li>`parent.insertBefore(elem, nextSibling)`</li>
<li>`parent.removeChild(elem)`</li>
<li>`parent.replaceChild(elem, currentElem)`</li>
<li>`parent.replaceChild(newElem, elem)`</li>
</ul>
Все эти методы возвращают `elem`.
**Запомнить порядок аргументов очень просто: вставляемый или удаляемый элемент -- всегда первый.**
Методы для изменения DOM также описаны в спецификации <a href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html">DOM Level 1</a>.

View file

@ -77,6 +77,7 @@
// показать ошибку
this.classList.add("error");
*!*
//... и вернуть фокус обратно
age.focus();
*/!*
} else {
@ -86,10 +87,14 @@
</script>
```
Если в примере выше ввести что-то нецифровое в поле "возраст", и потом попытаться табом или мышкой перейти на другой `<input>`, то обработчик `onblur` вернёт фокус обратно.
Этот пример работает во всех браузерах, кроме Firefox ([ошибка](https://bugzilla.mozilla.org/show_bug.cgi?id=53579)).
Если ввести что-то нецифровое в поле "возраст", и потом попытаться табом или мышкой перейти на другой `<input>`, то обработчик `onblur` вернёт фокус обратно.
Обратим внимание -- если из `onblur` сделать `event.preventDefault()`, то такого же эффекта не будет, потому что `onblur` срабатывает уже *после* того, как элемент потерял фокус.
## HTML5 и CSS3 вместо focus/blur
Прежде чем переходить к более сложным примерам, использующим JavaScript, мы рассмотрим три примера, когда его использовать не надо, а достаточно современного HTML/CSS.
@ -157,10 +162,14 @@
color: red;
font-style: italic;
}
.my*!*::-ms-input-placeholder*/!* {
color: red;
font-style: italic;
}
</style>
<input class="my" type="text" placeholder="E-mail">
Стилизуется везде, кроме IE
Стилизованный плейсхолдер
```
## Разрешаем фокус на любом элементе: tabindex

View file

@ -1 +0,0 @@
[edit src="solution"]Открыть решение в песочнице[/edit]

View file

@ -23,8 +23,6 @@
Первый: Enter в текстовом поле <input type="text" value="Текст"><br>
Второй: Нажать на "Отправить": <input type="submit" value="Отправить">
</form>
</button>
```
Ожидаемое поведение: