如何用CSS或JS将Gravity Form中的数字1替换为FontAwesome星星图标
2026-5-25
解决Gravity Form数字替换为FontAwesome星星图标问题
我来帮你搞定这个问题～你的代码有几个关键小错误，我一步步给你修正：
问题分析
- 错误的内容获取方式：你写的
$(this).attr("1")完全没有意义，这个"1"属性根本不存在，我们要获取标签里的文本内容，直接用$(this).html()（因为要处理HTML替换）就可以。 - 替换内容格式错误：你把"1"替换成了纯字符串"star"，但FontAwesome图标是需要用HTML标签渲染的，而且
.text()方法会把HTML代码当成纯文本显示，得用.html()方法来设置包含HTML的内容。
修正后的代码
首先，确保你的网站已经加载了FontAwesome资源（如果还没加载，需要在页面<head>里引入它的资源文件），然后使用以下代码：
<script> // 确保DOM加载完成后执行 $(document).ready(function() { $("#label_13_5_0").html(function() { // 替换文本中的"1"为FontAwesome常规星星图标 return $(this).html().replace("1", '<i class="far fa-star"></i>'); }); }); </script>
额外注意事项
- 确认元素选择器
#label_13_5_0是正确的：可以通过浏览器开发者工具（F12）检查目标元素的ID是否和你写的一致。 - 如果表单是通过AJAX动态加载的，可能需要把这段代码放在表单加载完成的回调事件里，或者使用事件委托来确保元素存在后再执行替换操作。
- FontAwesome的类名要对应正确：你要的是常规样式的星星，若使用FontAwesome 6版本，类名需调整为
fa-regular fa-star，请根据你实际使用的版本适配。
内容的提问来源于stack exchange，提问作者Petra Žagar
相关产品推荐
相关产品推荐
