如何通过 JavaScript 获取字符串中的数字？答案

【问题标题】：How to Get Number in String By JavaScript?如何通过 JavaScript 获取字符串中的数字？
【发布时间】：2017-02-24 09:07:52
【问题描述】：

我正在做一个项目。我有一个模拟时钟。它是由 jQuery 创建的。这个时钟放置在一个 div 元素中，当我想获取数字时，结果如下所示。

Days0Hours0Minutes0Seconds2

但我只想要数字。像这样：

numberArray[0] = 0; // days
numberArray[1] = 0; // hours
numberArray[2] = 0; // minutes
numberArray[3] = 2; // seconds

我该怎么做？

谢谢大家！

编辑：

当使用下面的代码时：

$("#PageOpenTimer").text(); // for div

结果：

Days0Hours0Minutes0Seconds2

当使用下面的代码时：

$("#PageOpenTimer").html(); // for div

结果：

<div class="time_circles"><canvas width="500" height="125"></canvas><div class="textDiv_Days" style="top: 44px; left: 0px; width: 125px;"><h4 style="font-size: 9px;">Days</h4><span style="font-size: 35px;">0</span></div><div class="textDiv_Hours" style="top: 44px; left: 125px; width: 125px;"><h4 style="font-size: 9px;">Hours</h4><span style="font-size: 35px;">0</span></div><div class="textDiv_Minutes" style="top: 44px; left: 250px; width: 125px;"><h4 style="font-size: 9px;">Minutes</h4><span style="font-size: 35px;">0</span></div><div class="textDiv_Seconds" style="top: 44px; left: 375px; width: 125px;"><h4 style="font-size: 9px;">Seconds</h4><span style="font-size: 35px;">1</span></div></div>

【问题讨论】：

str.match(/\d+/g)
你尝试过什么代码，你得到了什么输出，你希望得到什么输出，你对这个主题做了什么研究？
最好依靠 jquery 插件的方法，您可以使用该方法在页面上形成时钟来获取所需的信息。这样会很容易，而不是手动解析它。你知道你在这里使用了哪个插件吗？
是的！ github.com/wimbarelds/TimeCircles
$(".example").TimeCircles().getTime(); 会给你经过的秒数。所以使用这个数字你可以计算天、小时、分钟和秒。

标签： javascript jquery string split numbers

【解决方案1】：

你可以使用这个正则表达式来提取你想要的值

^Days(\d+)Hours(\d+)Minutes(\d+)Seconds(\d+)$

然后使用$("#PageOpenTimer").text(); 获取值并使用正则表达式进行测试以获取数字数组。

Tested in regex101

结果将是：

完整匹配 0-27 Days0Hours0Minutes0Seconds2

第 1 组。4-5 0
第 2 组。10-11 0
第 3 组。18-19 0
第 4 组。26-27 2

【讨论】：

【解决方案2】：

看看这种方法，它使用 TimeCircles 插件的方法 getTime() 来获取总秒数：

$(document).ready(function() {
  $(".example").TimeCircles();

  $(".start").click(function() {
    $(".example").TimeCircles().start();
  });
  $(".stop").click(function() {
    $(".example").TimeCircles().stop();
  });

  $(".getTime").click(function() {
    var totalSeconds = $(".example").TimeCircles().getTime();
    totalSeconds = Math.ceil(Math.abs(totalSeconds));

    var seconds = Math.floor((totalSeconds % 60));
    var minutes = Math.floor((totalSeconds % 3600) / 60);
    var hours = Math.floor((totalSeconds % 86400) / 3600);
    var days = Math.floor((totalSeconds % (86400 * 30)) / 86400);
    
    alert(days + " - "+hours+ " - "+minutes+ " - "+seconds);
    

  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="http://git.wimbarelds.nl/TimeCircles/inc/TimeCircles.js"></script>
<link href="http://git.wimbarelds.nl/TimeCircles/inc/readme.css" rel="stylesheet">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

<script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<button class="getTime">click to Get Time</button>
<button class="btn btn-success start">Start</button>
<button class="btn btn-danger stop">Stop</button>
<div class="example"></div>

【讨论】：