Javascript a<；内文本中特定于颜色的词（关键字）<；td>；
我在做一个项目，现在我需要做一些我不知道的事情。我想给Javascript a<；内文本中特定于颜色的词（关键字）<；td>；,javascript,jquery,html,jsp,Javascript,Jquery,Html,Jsp,我在做一个项目，现在我需要做一些我不知道的事情。我想给 我可以做静态的，因为文本是随机的，它们来自数据库 这是一个普通的文本，我想给像“动物，宠物”这样的词涂上颜色。 并为每种颜色加上特定的颜色，例如，动物的外形像红色，宠物的外形像蓝色 我想我必须使用Jquery来完成它，并在页面加载后创建一个函数来完成它（readyFunction） 但是我没有任何想法去做，我是jquery新手。你能给我一些想法吗 谢谢 这确实是一个“肮脏”的解决方案，但将作为如何完成任务的示例： <body>
<body>
<table id="the_table">
<tr>
<td>random words from DB: like an apple, pet, whatever, yet another apple</td>
</tr>
</table>
<script>
$(document).ready(function () {
var content_cell,
random_words = "",
colors_map = {
"apple": "red",
"pet": "blue"
};
// selector for your specific table cell
$('#the_table tr').each(function() {
content_cell = $(this).find("td:first");
});
// get cell content
random_words = content_cell.html();
// replace your keywords according the map
$.each(colors_map, function( index, value ) {
random_words = random_words.replace(new RegExp(index, 'g'), "<font color='" + value + "'>" + index + "</font>");
});
// set back html content into the cell
content_cell.html(random_words);
});
</script>
</body>
DB的随机词：像一个苹果，宠物，随便什么，还有另一个苹果
$（文档）.ready（函数（）{
var内容单元，
随机词=”，
颜色\u映射={
“苹果”：“红色”，
“宠物”：“蓝色”
};
//特定表格单元格的选择器
$（'#表tr'）。每个（函数（）{
content_cell=$（this.find（“td:first”）；
});
//获取单元格内容
random_words=content_cell.html（）；
//根据地图替换关键词
$.each（颜色、贴图、函数（索引、值）{
random_words=random_words.replace（新的RegExp（索引'g'），“”+index+“”）；
});
//将html内容设置回单元格中
html（随机词）；
});
function renderKey(){
//create color list in case you don't want to get invisible color such as 'white' from random color..
// make the list long enough to avoid duplicated color
var colors = ['red', 'blue', 'orange', 'cyan', 'black'];
var keyColor = {};
var keyIndex = 0;
//you may need more selectors to exclude unexpected elements, e.g. <td> in <thead>.
var x = document.querySelectorAll("td");
for (i in x){
//suppose your key words seperated by ',' in <td>
var keyWords = x[i].innerHTML.split(',');
x[i].innerHTML = keyWords.reduce(
function(total, value, index){
return total + '<span style="color:' +
(keyColor[value] || (keyColor[value] = colors[ keyIndex++ % colors.length])) +
'">' + value + '</span>';
},
''
);
}
}
函数renderKey（）{
//创建颜色列表，以防您不想从随机颜色中获得不可见的颜色，如“白色”。。
//使列表足够长，以避免重复的颜色
var colors=[“红色”、“蓝色”、“橙色”、“青色”、“黑色”]；
var keyColor={}；
var指数=0；
//您可能需要更多选择器来排除意外元素，例如，在中。
var x=document.querySelectorAll（“td”）；
对于（i in x）{
//假设你的关键词以“，”分隔
var关键字=x[i].innerHTML.split（'，'）；
x[i].innerHTML=keyWords.reduce(
函数（总计、值、索引）{
返回总计+“”+值+“”；
},
''
);
}
}