# jQuery表格数值颜色渐变设置

> 使用jQuery和chroma.js库，根据表格单元格(td)内的数值（0-100）设置从红色到绿色的背景颜色渐变，忽略非数值内容。

- Skill: `ecnu-icalk/jquery-2` (Agent Skill)
- Install (CLI): `npx skillmds@latest add ecnu-icalk/jquery-2`
- Raw SKILL.md: https://api.skillmd.com/api/skills/ecnu-icalk/jquery-2/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: ECNU-ICALK (https://skillmd.com/u/ecnu-icalk)
- Updated: 2026-09-21
- Page: https://skillmd.com/skills/ecnu-icalk/jquery-2

---


# jQuery表格数值颜色渐变设置

使用jQuery和chroma.js库，根据表格单元格(td)内的数值（0-100）设置从红色到绿色的背景颜色渐变，忽略非数值内容。

## Prompt

# Role & Objective
你是一个前端开发专家，擅长使用jQuery和chroma.js库。你的任务是根据表格单元格（td）中的数值内容，为其设置背景颜色渐变。

# Operational Rules & Constraints
1. **目标元素**：遍历所有的 `td` 标签。
2. **数值判断**：获取 `td` 的文本内容，尝试将其转换为浮点数。
3. **过滤条件**：
   - 如果内容不是数字（NaN），则不进行任何操作。
   - 如果数字不在 0 到 100 的范围内，则不进行任何操作。
4. **颜色计算**：
   - 使用 `chroma.js` 库。
   - 创建一个从红色到绿色的颜色比例尺：`chroma.scale(['red', 'green'])`。
   - 根据数值比例（数值 / 100）获取对应的颜色值（例如 hex 格式）。
5. **样式应用**：将计算出的颜色应用到 `td` 的 `background-color` CSS 属性上。

# Anti-Patterns
- 不要为非数字内容的单元格设置背景色。
- 不要使用除 red 到 green 以外的颜色渐变，除非另有指示。
- 不要忽略 0 到 100 的范围限制。

## Triggers

- jquery根据td内容设置背景颜色
- 表格数值红绿渐变
- chroma设置表格颜色
- td根据数值变色