使用jQuery替换第一个标题文本

Question

我有类似以下的标题：

<h3 class="left_header">First job partner</h3>
<h3 class="left_header" style="text-align:center;">Don't have an account ?</h3>

现在我想用jQuery或Java脚本更改第一个标题为“工作伙伴”，该怎么做？

- UI Dev

---

展示一下你已经尝试过的内容。 - Yury Tarabanko

我已经尝试过这样写：jQuery(".left_header h3").html("Public offers"); 但它没有起作用。我只需要更改第一个。 - UI Dev

.left_header h3 的意思是“选择所有父元素带有 left_header 类的 h3 元素”。而你需要的是“选择第一个带有 left_header 类的 h3 元素”，这可以用 h3.left_header:first 来实现。希望对你有所帮助。 - Yury Tarabanko

jQuery("h3.left_header:first") 不是 jQuery(".left_header h3")。 - Bhojendra Rauniyar

Answer 1

尝试使用 class 为 .left_header 的 h3 标签，并使用 :first 选择器从元素集合中获取第一个实例。

$('h3.left_header:first').text('Job partner')

DEMO

- Rajaprabhu Aravindasamy

---

@RIADev 很高兴能够帮助..! - Rajaprabhu Aravindasamy

Answer 2

试着用这个。

$(".left_header:first").html("yourNewTitle");

- Jayesh Goyani

Answer 3

你可以使用.first()方法（http://api.jquery.com/first/）

$( "h3" ).first().html("Job partner");

或者

您可以使用jQuery(":first")（https://api.jquery.com/first-selector/）

$(".left_header:first").html("Job partner");

fiddle

- Govind Singh

Answer 4

试试这个：

 $('h3:first-child').html('sublink_active');

工作演示

- Milind Anantwar

Answer 5

试试这个

$("h3:first-child").html("Job Partner")

demo

- Dhaval Marthak

Answer 6

JQuery: $('.left_header').first().text("职业伙伴");

- Healkiss

Answer 7

你的代码：

jQuery(".left_header h3").text("Public offers");

你的代码与你的要求不匹配。因为上面的代码选择了“left_header”类下的所有

元素。而在你的HTML中，h3有一个名为left_header的类。所以你应该使用以下选择器来选择元素-

$("h3.left_header");

现在你想要选择第一个元素，所以可以像这样使用索引号 -

document.getElementsByClassName("left_header")[0].innerText = "Job Partner";

或者

var g = $("h3.left_header");
$(g[0]).text("Job Partner");

演示1

演示2

注意：有不止一种方法可以完成此任务-

$(".left_header:first").text("Job Partner");

工作演示1

- Ishan Jain

---

一个简单的建议，不要使用HTML，它会影响其他标题，所以使用文本。对我来说，.text()可以代替.html()。 - UI Dev

@RIADev：感谢您的建议。您是正确的，“.html()”会影响所有子元素。请查看更新后的答案。 :) - Ishan Jain