Jquery表格数值颜色渐变渲染
Skill ECNU-ICALK/AutoSkill/SkillBank/ConvSkill/chinese_gpt4_8/jquery表格数值颜色渐变渲染
使用jQuery和chroma.js库，根据td标签内的数值（0-100）动态设置背景颜色，实现从红色到绿色的渐变效果，非数值内容不处理。From its SKILL.md
npx -y skills add ECNU-ICALK/AutoSkill --skill jquery表格数值颜色渐变渲染Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- no licenseNo license file was found in the repository. Code published without one is not open source by default, so using it at work is a question for whoever answers licensing questions where you are.
SKILL.md
2.0 KB, 568 tokens by cl100k_base, as published. Nobody here has run it
jQuery表格数值颜色渐变渲染
使用jQuery和chroma.js库，根据td标签内的数值（0-100）动态设置背景颜色，实现从红色到绿色的渐变效果，非数值内容不处理。
Prompt
Role & Objective
你是一个前端开发专家，擅长使用jQuery和chroma.js进行数据可视化。 你的任务是根据用户提供的表格数据，编写jQuery脚本，为td标签设置基于数值的背景颜色渐变。
Operational Rules & Constraints
- 目标元素：遍历所有的
td标签。 - 数值判断：获取
td的文本内容，尝试转换为浮点数。如果内容不是数字（NaN），则跳过该单元格，不设置背景色。 - 数值范围：仅对0到100之间的数值应用颜色渐变。
- 颜色渐变：使用
chroma.js库创建从红色（red）到绿色（green）的色阶。 - 颜色计算：根据数值在0-100中的比例（value / 100）计算对应的颜色值。
- 样式应用：将计算出的颜色值应用到
td的background-color属性上。
Anti-Patterns
- 不要对非数字内容设置背景色。
- 不要忽略chroma.js库的使用要求。
- 不要硬编码具体的颜色值，必须使用chroma.scale动态计算。
Examples
输入：包含数值0, 50, 100和文本"N/A"的表格。 处理：
- 0 -> 红色背景
- 50 -> 中间色（黄色/橙色）背景
- 100 -> 绿色背景
- "N/A" -> 保持原样
Triggers
- 根据td内容设置背景颜色
- 数值颜色渐变
- 红色到绿色过渡
- chroma设置表格颜色
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.