Question

jquery 如何获取字体颜色为红色的元素

Answer 1

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：index.html，并引入jquery。

2、在index.html中的<script>标签，输入jquery代码：

$('span').each(function () {

if ($(this).css('color') === 'rgb(255, 0, 0)') {

$('body').append($(this).text());

}

});

3、浏览器运行index.html页面，此时用jquery获取到了所有红色字体颜色元素并打印了内容。

Answer 2

这个问题可以采用如下思路，为“字体颜色为红色”设置一个class，然后添加到需要的元素上，那么问题转化为获取含有此类的元素，所以可用如下两行代码：

.red{color:red;}  /*设置red类表示颜色为红色*/

$(".red")  // 获取含有red类即字体颜色为红色和元素

示例代码如下

1. 创建Html元素

   <div class="box">
   	<span>获取字体红色的元素，将其改为蓝色：</span><br>
   	<div class="content">
   		<li>梨子</li>
   		<li class="red">李子</li>
   		<li class="red">栗子</li>
   		<li>荔枝</li>
   		<p class='red'>我也是红色</p>
   	</div>		
   	<input type="button" value="获取字体红色的元素">
   </div>

2. 设置css样式

   div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
   div.box span{color:#999;font-style:italic;}
   div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
   li{margin:10px 0;}
   .red{color:red;}
   .blue{color:blue;}
   input[type='button']{height:30px;margin:10px;padding:5px 10px;}

3. 编写jquery代码

   $(function(){
   	$("input:button").click(function() {
   		$(".red").addClass('blue');
   	})
   })

4. 观察效果

• 初始状态

  

• 点击按钮后

  

Answer 3

这个你得看红色的字体是通过font来设置的还是css来设置的，红色的表示颜色有red,#f00,#ff0000，可以判断起属性来获取。以red为例
1、获取用font来设置的字体
<font color="red">字体演示</font>
var f = $('font[color="red"]').text();

2、获取通过css来设置的字体
<div class="fff">字体演示</div>
if($('div').hasClass('fff')){
var f = $(this).text();
}