元素定位练习 · CLASS 属性定位

📌 方法概念
原理：通过元素的一个 class 名称定位；匹配所有 classList 中包含该名称的元素（多个 class 元素也能定位其中任何一个）。
适用场景：批量统计同类元素（如一组标签卡片、用户头像、商品卡片、列表项）、或页面中 class 语义明确且唯一的特殊元素。
注意事项：只能传「单个 class 名」，不能有空格！如元素 class="demo-btn green" 必须分别用 demo-btn 或 green，不能一起传；多 class 组合请用 By.CSS_SELECTOR。

💻 Selenium 示例（Python）

from selenium import webdriver
from selenium.webdriver.common.by import By
# 1) 定位单个 class="avatar-name" 的第一个用户卡片
first_user = driver.find_element(By.CLASS_NAME, "attrClass_avatar_name")
print(first_user.text)
# 2) find_elements 批量读取所有 5 个标签卡片文字
tags = driver.find_elements(By.CLASS_NAME, "attrClass_tag_box")
for t in tags: print(t.text)
# 3) 组合定位：先 CLASS 取用户卡片容器，再找内部姓名/职位
cards = driver.find_elements(By.CLASS_NAME, "attrClass_img_card")
for c in cards:
    name = c.find_element(By.CLASS_NAME, "attrClass_avatar_name").text
    role = c.find_element(By.CLASS_NAME, "attrClass_avatar_role").text
# 4) 进阶：订单卡组合定位 — 遍历所有订单容器，在每张卡内部读取状态/金额，做统计或过滤
orders = driver.find_elements(By.CLASS_NAME, "attrClass_order_card")
for o in orders:
    st    = o.find_element(By.CLASS_NAME, "attrClass_order_status").text
    amount = o.find_element(By.CLASS_NAME, "attrClass_order_amount").text
    print(st, amount)

📋 本节练习清单

• ✅ 练习目标 1：技术标签卡片 — find_elements(By.CLASS_NAME, "attrClass_tag_box") 拿到 5 个卡片，按索引点击每个卡片并获取文字内容
• ✅ 练习目标 2：用户头像卡片（组合定位） — 先 find_elements(By.CLASS_NAME, "attrClass_img_card") 拿到 3 张卡片容器，再每张卡内部 card.find_element(By.CLASS_NAME, "attrClass_avatar_name") / attrClass_avatar_role 读取姓名和职位
• ✅ 练习目标 3：订单卡片（组合定位进阶） — 先拿 6 张 attrClass_order_card 容器，每张内部再用 class 定位 4 个子元素；完成：a. 按状态统计数量（已付款×2 / 已发货×1 / 待付款×1 / 已完成×1 / 已取消×1）b. 筛选金额 ≥ 500 的大订单（1280.50 和 899.00 共 2 张）c. 确认页面上 5 种状态徽章都能被 find_element 找到