从具有相同类的多个元素中提取Javascript中的数字[关闭]答案

【问题标题】：Extract numbers in Javascript from multiple elements with same class [closed]从具有相同类的多个元素中提取Javascript中的数字[关闭]
【发布时间】：2016-09-07 20:31:42
【问题描述】：

我的页面中有相同类的不同元素。所有这些元素都包含文本和数字。我需要从所有元素中提取所有数字。

例如我有以下元素：

<div class="myelement">bla bla bla 123</div>
<div class="myelement">bla bla bla 456</div>
<div class="myelement">bla bla bla 789</div>

..我需要分别提取123、456、789。你能帮帮我吗？

非常感谢您的帮助。

【问题讨论】：

您似乎知道的足够多，应该使用正则表达式，那么您卡在哪里了？请展示您的尝试。

标签： javascript regex numbers extract

【解决方案1】：

在字符串中查找所有数字的一种解决方案是使用正则表达式/\d+/：

var strings = Array.prototype.map.call(
  document.getElementsByClassName('myelement'),
  function(element) {
    return element.innerText;
  }
);

var numbers = [];
var regex = /\d+/;

strings.forEach(function(item) {
  regex.exec(item).forEach(function(result) {
    numbers.push(+result); // convert to a number with + prefix
  });
});

console.log(numbers);

<div class="myelement">bla bla bla 123</div>
<div class="myelement">bla bla bla 456</div>
<div class="myelement">bla bla bla 789</div>

【讨论】：

【解决方案2】：

另一种解决方法：

var results = []
els = document.getElementsByClassName('myelement');
[].forEach.call(els, function(el) {
    results.push(el.innerHTML.match(/\d+/)[0])
});
results.forEach(x => console.log(x));

<div class="myelement">bla bla bla 123</div>
<div class="myelement">bla bla bla 456</div>
<div class="myelement">bla bla bla 789</div>

【讨论】：

【解决方案3】：

使用 JQuery，您可以循环每个 myelement，将字符串拆分为字符，并使用 isNumeric 将数字放入数组中。

        var numbers = [];

        var vals = $('.myelement').each(function(i,v){

            var str = $(this).html();               
            var chars = str.split("");

            $.each(chars, function(i,v){
                if($.isNumeric(v)) numbers.push(v); 
            });
        });

【讨论】：

【解决方案4】：

我的提议是基于Array.map:

document.getElementsByClassName('myelement') 返回一个 HTMLCollection
为此集合的每个元素调用 map 函数，以便将每个元素转换为数组元素
对于每个单独的文本，只返回数字

结果是一个数组。

var result = [].map.call(document.getElementsByClassName('myelement'), function(ele, index) {
  return  ele.textContent.replace(/\D*/, ''); // remove all non digit
});
console.log(result)

<div class="myelement">bla bla bla 123</div>
<div class="myelement">bla bla bla 456</div>
<div class="myelement">bla bla bla 789</div>

【讨论】：