Javascript 在 元素中获取文本答案

【问题标题】：Javascript get text inside a elementJavascript 在 元素中获取文本
【发布时间】：2011-07-11 13:24:53
【问题描述】：

我需要获取元素内的文本。

我只能获取这个元素的类而不是 ID。

<span class="fileName">test.png</span>

所以我需要一种方法来获取test.png，但正如你所见，我只有元素的类，没有 ID。

请注意，我们可能有更多 ，所以它可能看起来像这样

<span class="fileName">test1.png</span>
<span class="fileName">test2.png</span>
<span class="fileName">test3.png</span>
<span class="fileName">test4.png</span>

如果我们有更多，比如上面的例子，我需要获取所有值，而不仅仅是一个，因为我需要使用 jQuery 将此值传递给另一个页面。因此它应该能够从该元素中获取一个或多个值。

请帮忙！

而且我也不是 javascript 专家！

【问题讨论】：

请不要使用标签，“你好”或“谢谢”。 SO 不是论坛。
使用计数器，例如 $(".fileName").eq(counter) 或 .get(counter) 或者你可以使用 .each(function(event){});

标签： javascript jquery class

【解决方案1】：

var filenames = $('.fileName').map(function(){
    return $(this).text();
}).get();

数组filenames 将包含所有图像的名称。您可以将此数组传递给另一个 jQuery 函数，或者您喜欢的任何其他地方。

You can test it here »

更新

由于您要求文件名是用逗号分隔的字符串，因此您可以这样做：

var filenames = $('.fileName').map(function(){
    return $(this).text();
}).get().join(',');

现在，filenames 将包含字符串 test1.png,test2.png,test3.png,test4.png。

【讨论】：

它返回一个数组..我如何获取普通值而不是数组。有没有办法获取这个数组的值？
filenames.toString()，如果您希望分隔符是逗号 ,，就可以了。否则，您可以使用filenames.join('yourSeparatorHere')。一旦你有了数组，你就可以用它做任何你喜欢的事情。 :)
你能把它包含在上面的代码中吗？正如我所说，我不是 javascript 专家。它对我没有任何意义。我只想在 var 文件名中获取用逗号分隔的每个文件的名称，仅此而已 =(

【解决方案2】：

使用document.getElementsByClassName：http://jsfiddle.net/pCswS/。

var elems = document.getElementsByClassName("fileName");
var arr = [];
for(var i = 0; i < elems.length; i++) {
    arr.push(elems[i].innerHTML);
}
alert(arr);

（由于您没有使用 jQuery 标记问题，我假设您必须使用纯 JavaScript 来完成。）

【讨论】：

同上，返回单词：Array。但是我如何获得真实姓名？
@DiegoP：它确实对我有用 - 否则将其更改为 alert(arr.join())，它将其转换为字符串（元素之间使用逗号）。

【解决方案3】：

$('span.fileName').each(function() {
    var fileName = $(this).text();
    doSomethingWithFileName(fileName);
});

这里span.fileName 选择器返回所有类文件名的跨度，然后我们遍历，从每个跨度读取文本。您可能想先找到一个容器元素，然后只在其中迭代，例如

var $container = $('#myFileNames');
$container.find('span.fileName').each( ... );

【讨论】：

@AndyL 总是这样 - 对不起。实际上我误读了他想要数组中的所有值：Shef 的答案更好。
好的，但我如何获得真实姓名。现在我得到了这个词：Array

【解决方案4】：

Here's我的看法：

var spans = document.getElementsByClassName('fileName');
var values = [];
for(var i = 0; i < spans.length; i++) {
    values.push(spans[i].innerHTML);
}

// Example of processing: alert the values
alert(values);

【讨论】：

【解决方案5】：

使用下面的 jQuery 选择器

$("span.fileName").html()

【讨论】：

它只返回一个值而不是全部