jQuery在同一个类的多个实例中用名字替换全名[重复]

Question

我在一个有多个实例的类 .label-name 中有一个全名。

<span class="label-name">Joe Demo</span>
<span class="label-name">Jane Demo</span>
<span class="label-name">Lisa Demo</span>

我怎样才能只用名字替换全名？

Answer 1

你可以得到文本，用空格分割，然后取第一个元素。

例如：

$( document ).ready(function() {
    var fullName = $(".label-name").first().text(); //This will get the text from the first element with the class label-name
    var nameArray = fullName.split(" "); //Split the text by spaces into an array
    var firstName = nameArray[0]; //Take the first element of the array 
    $(".label-name").first().text(firstName); //Set the text of the first element with the class label-name to the first name
});

编辑：正如我在 cmets 中所指出的，这将获得具有类标签名称的第一个元素。如果这个类有多个元素，您可能需要不同的选择器。 jQuery 选择器记录在http://api.jquery.com/category/selectors/。如果您发布完整的 HTML 源代码并让我知道您想要哪个元素，我会提供进一步的建议。

编辑2：如果您需要选择和替换具有相同类的多个元素，您可以从代码中删除.first() 选择器并使用循环来编辑结果。例如：

$( document ).ready(function() {
    var fullNameObjects = $(".label-name");
    $.each(fullNameObjects, function () {
         var nameArray = this.split(" ");
         var firstName = nameArray[0];
         this.text(firstName);
    });
});