jq过滤选择器

最新推荐文章于 2024-09-06 10:19:06 发布

我的纸飞机啊飞啊飞啊

最新推荐文章于 2024-09-06 10:19:06 发布

阅读量337

点赞数

CC 4.0 BY-SA版权

分类专栏： jq教学

本文链接：https://blog.youkuaiyun.com/qq_33530408/article/details/81167117

jq教学专栏收录该内容

12 篇文章

订阅专栏

本文展示了如何使用jQuery库实现对HTML列表元素的动态样式修改，包括根据元素位置设置背景色和调整特定元素的字体大小。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

引入jq文件jquery-1.12.4.js

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<ul>
  <li>我是第1个li</li>
  <li>我是第2个li</li>
  <li>我是第3个li</li>
  <li>我是第4个li</li>
  <li>我是第5个li</li>
  <li>我是第6个li</li>
  <li>我是第7个li</li>
  <li>我是第8个li</li>
  <li>我是第9个li</li>
  <li>我是第10个li</li>
</ul>

<script src="jquery-1.12.4.js"></script>
<script>
  
  $(function () {
    
    //下标为偶数，过滤
    $("li:even").css("backgroundColor", "red");
    $("li:odd").css("backgroundColor", "cyan");
    $("li:lt(1)").css("fontSize", "32px");
    
  });
  
</script>
</body>
</html>