Javascript 在jQuery中单击文本时，如何允许css样式的单个更改？

我有很多绿色字符串： style.css：

.green_text {
  color: green;
  font-family: 'Arial';
  font-size: 20px;
  font-weight: bold;

}
.green_text:hover {
  cursor: pointer;
}

index.html：

<span class="green_text">text 1</span><br>
<span class="green_text">text 2</span><br>
<span class="green_text">text 3</span><br>
<span class="green_text">text 4</span><br>
<span class="green_text">text 5</span><br>
<span class="green_text">text 6</span><br>
<span class="green_text">text 7</span><br>
<span class="green_text">text 8</span><br>

我想当我单击text1时，颜色会变为红色，但当我单击text2时，只有text2的颜色会变为红色，而text1的颜色会变为绿色。我怎么能用很多弦来做呢

我想当我单击text1时，颜色会变为红色，但当我单击text2时，只有text2的颜色会变为红色，而text1的颜色会变为绿色

您可以先将“剩余”转为绿色

$(".green_text").click(function(){
    $(".green_text").css("color","green");
    $(this).css("color","red");
})

---

单击时，将所有元素的颜色设置为

绿色

，然后仅将单击的元素的颜色更改为

红色

$（文档）.ready（函数（）{
$（“.green_text”）。单击（函数（）{
$（“.green_text”）.css（“颜色”、“绿色”）；
$（this.css（“颜色”、“红色”）；
})
})

.green\u文本{
颜色：绿色；
字体系列：“Arial”；
字体大小：20px；
字体大小：粗体；
}
.green_文本：悬停{
光标：指针；
}

正文1

正文2

正文3

正文4

正文5

正文6

文本7

文本8

只需点击

.green\u txt

即可将其他的css更改为

绿色

，并为当前添加颜色红色

$(document).ready(function() {
  $(".green_text").click(function() {
   $(".green_text").css("color","green");
    $(this).css("color", "red");
  })
})

下面是工作片段

$（文档）.ready（函数（）{
$（“.green_text”）。单击（函数（）{
$（“.green_text”）.css（“颜色”、“绿色”）；
$（this.css（“颜色”、“红色”）；
})
})

.green\u文本{
颜色：绿色；
字体系列：“Arial”；
字体大小：20px；
字体大小：粗体；
}
.green_文本：悬停{
光标：指针；
}

正文1

正文2

正文3

正文4

正文5

正文6

文本7

文本8

首先，我强烈建议在JS代码中设置

css（）

的基础上添加/删除一个类。从那里，您可以使用

兄弟姐妹（）.removeClass（）

来完成您需要的操作。还要注意，在

：hover

状态中设置

指针是多余的。直接把它放到
.green\u text
类中。试试这个：


$（文档）.ready（函数（）{
$（“.green_text”）。单击（函数（）{
$（this.addClass（'active'）.sides（）.removeClass（'active'）；
})
})
.green\u文本{
颜色：绿色；
字体：粗体20px Arial；
光标：指针；
}
.green_text.active{color:red；}

正文1

正文2

正文3

正文4

正文5

正文6

文本7

text 8
你尝试了什么？@NathanP。Op发布了他已经尝试过的东西
$(document).ready(function() {
  $(".green_text").click(function() {
   $(".green_text").css("color","green");
    $(this).css("color", "red");
  })
})