Ответ 1
Строго говоря, элемент <div> является непустым/непустым элементом в HTML, т.е. он не предназначен для себя -Закрыть. Хотя <div /> является действительным XHTML, поскольку /> указывает на самозакрывающийся (или пустой) XML-элемент - он интерпретируется с помощью общих парсеров HTML и некоторых валидаторов как незакрытый открывающий тег и поэтому является недопустимым HTML 4.01 и HTML5. 1
Фактически, запуск вашего данного фрагмента HTML с помощью W3C validator (как HTML5) приводит к этому сообщению об ошибке:
Самозакрывающийся синтаксис (/" > ), используемый для не-void HTML-элемента. Игнорирование косой черты и обработка в качестве начального тега.
Следовательно, что вы видите.
Из спецификации HTML5 (в первой ссылке):
Элемент non-void должен иметь конечный тег, если подраздел для этого элемента в разделе элементов HTML этой ссылки не указывает, что его конечный тег можно опустить.
Далее, в подразделе для элемента <div> указано:
Элемент div должен иметь как начальный тег, так и конечный тег.
Это делает <div> в отличие от <p> или <li>, которые, как известно, не всегда требуют конечного тега.
Если вы поместите <p> сразу после незакрытого <p>, он неявно закрывает предыдущий <p>. Точно так же идет <li>. Это связано с тем, что вы не можете напрямую вставлять несколько абзацев или элементов списка вместе. Тем не менее, <div> может быть привязана к любой глубине. Таким образом, открывающий тег <div> не закрывает ранее нераскрытый тег <div>.
И почему вы видите то, что видите.
1 В настоящих страницах XHTML (сериализованных как XML, служащих как application/xhtml+xml), первый элемент <div /> не будет расширяться, чтобы обернуть второй элемент <div>text</div>. Вместо этого, как XHTML, он будет следовать правилам XML и содержать себя как пустой элемент, вместо того, чтобы следовать правилам супа HTML-тегов и сам интерпретироваться как тег открытия.