11、jQuery网页操作与DOM遍历实战

jQuery网页操作与DOM遍历实战

1. 元素分类与选择器优化

在网页开发中，合理设置HTML和CSS能帮助jQuery更高效地查找网页元素。为样式表添加类（class）和ID，并为HTML元素的属性设置合适的类和ID，这样能让元素选择更轻松，还能节省后续的编码时间。

对于jQuery而言，选择器不仅能控制页面的外观和感觉，还能用于匹配（或查询）页面上的元素。例如，我们可以将具有相同特征的元素归为一个类，像下面的例子：

.meat
<li class="meat">turkey</li>
<li class="meat">chicken</li>
<li class="meat">eggs</li>
<li class="meat">lamb shoulder</li>

这样，我们可以通过一个选择器匹配所有属于“meat”类的元素，而不是为每个元素单独编写选择器。

2. 菜单元素分类练习

接下来有一个菜单元素分类的练习，需要根据主厨的要求为菜单中的食材标注合适的类（fish、meat或hamburger），如果食材不需要分类则留空。以下是部分菜单代码：

<li>Thai-style Halibut
 <ul class="menu_list">
  <li                 >coconut milk</li>