javascript - 语义与 DOM 操作

Question

您对语义标记与 DOM 操作有何看法？

例如，我可以在如下字段下显示错误消息

<label for="email">Email:</label>
<input type="email" name="email" id="email">
<div class="error" id="email-error">Please enter a valid email address.</div>

错误类将被隐藏，并显示在 javascript 错误中。这显然需要很少的 DOM 操作，但它是语义标记吗？

另一种选择是将错误 div 排除在外，然后执行类似的操作

var element = $('#email');

if($("#EmailError").length==0) {
     $(element).after('<div class="error" id="email-error">Please enter a valid email address.</div>');
}

并且仅在确实存在错误时才将其放入。大家怎么看？

Answer 1

正如丹达维斯所写：

<input type="email">

是要走的路。另一方面，如果你想在没有 html5 验证的情况下发出错误信号，你应该使用额外的标签元素而不是 div。

<label for="email" class="error">Please enter a valid email</label>.

Answer 2

使用 JavaScript 添加内容比添加错误但不可见的内容（将被搜索引擎和没有 CSS 的人使用）要好得多。