jquery或者js，获取匹配字符串更换CSS样式
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery或者js，获取匹配字符串更换CSS样式相关的知识，希望对你有一定的参考价值。
比如说
有个div的class名为name
有个div的class名为box
使用jquery或者js实现：
如果name里面含有字符串"您好"的话，box的背景颜色为黄色；
如果name里面含有字符串"再见"的话，box的背景颜色为红色；
你好，根据你的要求，我写了下面的范例代码，请参考：
<script type="text/javascript">//记得要先引入jQuery.js框架哦
$(document).ready(function()
if($('.name').text().match('您好')) //如果包含“您好”
$('.box').css('background','yellow'); //box背景为黄色
if($('.name').text().match('再见')) //如果包含“再见”
$('.box').css('background','red'); //box背景为红色
);
</script>
附：完整的html范例代码，用浏览器打开即可看到效果。
如还有疑惑，欢迎追问。
不错不错~~清晰明了 谢谢
参考技术A使用javascript实现。
1、获取所有div
2、判断是否是需要的div
3、改变目标div的背景
var nameDiv,boxDiv;//分别声明两个div，js没有类选择器，只能自己通过循环查找
for(var i=0;i<divs.length;i++)
var div = divs[i];
var attr = div.getAttribute("class");
if(attr == "name")
nameDiv = div;//获取class为name的div
else if(attr == "box")
boxDiv = div;//获取class为box的div
if(nameDiv.innerHTML.indexof("您好") > 0)
boxDiv.style.background="yellow";//颜色设置为黄色
else if(nameDiv.innerHTML.indexof("再见") > 0)
boxDiv.style.background="red";//颜色设置为红色
以下使用jquery。jquery存在类选择器，所以可以直接取到所要的元素。
var nameDiv = $(".name").text();var boxDiv = $(".box").text();
if(nameDiv.match('您好'))
$(".box").attr("background","yellow");
if(nameDiv.match('再见'))
$(".box").attr("background","red"); 参考技术B $('.div').css('color','red');
选中包含该字符串的div节点,用jquery的css()方法,可以改变样式
js如何更改css样式，
我想将css设置的图片style="background:url('/Images/shuru.gif') no-repeat;"，如何在js中将图片隐藏，
JS可以使用css属性来进行样式修改，并且不仅可以修改单一属性，也可以同时修改多个属性。
案例
以下小案例使用JQuery作为演示。
前提： html页面首先必须引入JQuery，放置在body体最后的位置。例如：
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>html部分代码
<p>我是一个段落，我没有背景颜色的，但是JQuery会给我增加背景颜色。
</p>
<button>
点击我，给上面段落添加黄色背景颜色。
</button>
JQuery代码
$("button").click(function()$("p").css("background-color", "yellow");
);
修改多个属性
$("button").click(function()$("p").css("background-color": "yellow", "font-size": "200%");
);
结论与解释：
首先使用Jquery选择器进行元素选择 - $("button")
为该元素绑定点击事件 - click
click中的匿名函数修改css属性。
在css属性的修改中，p段落有了黄色背景； 多个属性修改，不但有了黄色背景而且字体是之前的两倍大小。
注意事项：
可以不用非要绑定事件，在本案例中，绑定事件是为了更好地演示Jquery如何操作css属性。
修改单一属性和多个属性的写法是有区别的，多个属性使用,属性与值之间用：分割，属性与属性之间用，分割。
<html>
<head>
<meta charset="utf-8">
<title>exp</title>
<style>
p
background-image:url(写你的图片url);
</style>
</head>
<body>
<p id="p"></p>
<a href="javascript:void(0);" onclick="hideImg()">点击我隐藏</a>
<a href="javascript:void(0);" onclick="showImg()">点击我显示</a>
<a href=" http://www.dadaxun.com/">达达寻</a>
</body>
</html>
<script>
function hideImg()
var p = document.getElementById("p");
p.style.backgroundImage = "";
function showImg()
var p = document.getElementById("p");
p.style.backgroundImage = "url(写你的图片url)";
</script>
达达寻 dadaxun 为你解答
以上是关于jquery或者js，获取匹配字符串更换CSS样式的主要内容，如果未能解决你的问题，请参考以下文章