好的,这应该是显而易见的......
我有一个带有一些文字和链接的div。 我想更改文本的背景颜色,但不链接。
<div id="one">
Foo bar <a href="http://stackoverflow.com">link</a> barfoo
</div>
不明白为什么这不起作用......
$("#one:not(a)").css("background-color", "red");
或
$("#one, #one *:not(a)").css("background-color", "red");
和
$("#one").find("a").not(this).css("background-color", "red");
将背景颜色设置为与我想要的完全相反..
感谢。
答案 0 :(得分:0)
你遇到的问题是除了链接之外你的div中没有其他元素。
将您的HTML更改为
<div id="one">
<span>Foo bar </span><a href="http://stackoverflow.com">link</a><span> barfoo </span>
</div>
然后你可以做
$("#one :not(a)").css("background-color", "red");
(注意空格)。
您可以自动执行跨度插入:
$("#one").html(function(_,h){
return '<span>'+h.replace(/<a\s+.*?<\/a>/g,function(s){
return '</span>'+s+'<span>'
})+'</span>';
});
$("#one :not(a)").css("background-color", "red");
另一个解决方案是给div一个红色并给你的链接一个不透明的颜色:
$("#one").css("background-color", "red");
$("#one a").css("background-color", "white"); // give the color of what's behind the div
答案 1 :(得分:0)
你试过这个吗?
$("#one").not("a").css("background-color", "red");
$("a").css("background-color", "white");
因为“#one”是包含div,所以它会使整个容器着色。在锚点后面做出选择是保留颜色的方法。
否则,您可以添加如下内容,然后仅选择跨度:
<div id="one">
<span>Foo bar</span> <a href="http://stackoverflow.com">link</a> <span>barfoo </span>
</div>
但这并不完全是语义上的。如果你正在做一些更现实的世界,少一点barfoo,它可能更实用。