Regex Zahl Extrahieren mit Verbindungspunkt und Bindestrich

Question

Lets sagen, dass ich die folgende Zeichenfolge haben:

<div style="color: red; display.: inline-block;"><i class="fa fa-arrow-down" aria-hidden="true"></i> -18.9%</div> 

Was zur Zeit extrahieren möchten ist -18,9

Ich habe [^ 0-9.-] + in Javascript Aber das wird jeden Punkt und Bindestrich in der Zeichenfolge enthalten, so brauche ich etwas, das nur Komma und Bindestrich extrahieren, wenn eine Zahl folgt.

Und clearify können die Punkte und Bindestriche oder kann nicht existieren, manchmal nicht die html entweder

Answer 1

Don't parse HTML with regex. Verwenden Sie stattdessen eine DOM parser, das es ein Stück Kuchen macht:

var str = '<div style="color: red; display.: inline-block;"><i class="fa fa-arrow-down" aria-hidden="true"></i> -18.9%</div>'; 
 
var parser = new DOMParser(); 
 
var doc = parser.parseFromString(str, "text/html"); 
 
// get text content and remove '%' from it. 
 
console.log(doc.documentElement.textContent.replace(/%/, ''));

Beachten Sie, dass dies auch funktioniert, wenn str nur Klartext, wie 25.3.

Wenn es sich um eine gültige Nummer handelt, können Sie sie mit oder der Einheit + konvertieren. Beachten Sie, dass tausende Trennzeichen zuerst mit einem replace entfernt werden müssen.

Wenn Ihr tatsächliches HTML-String komplexer ist und andere Textknoten darin, verwenden Sie dann die üblichen DOM-Methoden die Knoten Ihres Interesses zu finden, zum Beispiel:

doc.querySelector('div').textContent 

Answer 2

Es klingt wie du bist Umgang mit einer Zeichenfolge, die aus HTML zu stammen scheint. Wenn dies der Fall ist und Sie die innerHTML Eigenschaft nicht erhalten können, gibt es 2 Möglichkeiten.

1. Konvertieren in HTML und einen String Match - mit Start innertext

var tempEl = document.createElement('div'); 
tempEl.innerHTML = '<div style="color: red; display.: inline-block;"><i class="fa fa-arrow-down" aria-hidden="true"></i> -18.9%</div>'; 

var myNumber = parseFloat(tempEl.children[0].innerText.trim()) 

wird

-18.9 

2. Regex verwenden in der Zahl führen Diese Regex wird und gefolgt von einer ganzen oder Dezimalzahl

/(-)?\d+(\.\d*)*/g 

Ihr Beispiel verwenden:

<div style="color: red; display.: inline-block;"><i class="fa fa-arrow-down" aria-hidden="true"></i> -18.9%</div> 

in einem Spiel von

-18.9 

hier ein demo führen.

Answer 3

hier der einfache reguläre Ausdruck dafür [-0-9]+.?[0-9]