How to get value at a specific index In JavaScript?

Question

I have this string = rgb(192, 194, 194) -10px -10px 0px; I need to get the first -10px in that string and store as a variable. That number is dynamic and will change.

Thanks for the help. Here is what I have. I'm grabbing the text-shadow of a span and need to get the -10px value which will be added to the tooltip. This is a dynamic number that will change based on where a user clicks on a slider. I just cant figureout how to parse that string to get the -10px value.

 $('.slider-track.shadow').on('click', function (e) {
        e.preventDefault();
        var currentValue = $('.editing').find('span').css('text-shadow');
        var replaceValue = currentValue.replace(/\D/g, '');

        console.log(currentValue);
        $('.tooltip-inner.shadow').text(currentValue);
    });

It's quite tempting to close this as a duplicate of [Tutorials for writing a parser with Javascript](http://stackoverflow.com/questions/5874609/tutorials-for-writing-a-parser-with-javascript) — Quentin, Nov 19 '14 at 19:23

score 2 · Accepted Answer · answered Nov 19 '14 at 19:36

2

This regex should do the trick.

var str = "rgb(192, 194, 194) -10px -10px 0px;";
var m = str.match(/(.[^)][^\s]*)+\s(.*)+\s/);

if ((m instanceof Array) && m[1]) {
    console.log(m[1].trim()) // '-10px'
}

answered Nov 19 '14 at 19:36

Jonathan Crowe

5,793
1
18
28

Very clean. Nice approach. – Wes Duff Nov 19 '14 at 19:42

Wes Duff · Answer 2 · 2014-11-19T19:39:55.910

0

Here you go.

var stringToUse = "rgb(192, 194, 194) -10px -10px 0px",
start = stringToUse.lastIndexOf(')'),
end = stringToUse.indexOf('px');

stringToUse = stringToUse.substring(start +1, end).trim();

//outputs "-10"

Hope this helps.

Update from question.

var stringToUse = "rgb(192, 194, 194) 0 -10px 0px",
start = stringToUse.lastIndexOf(')') + 1,
end = stringToUse.slice(start).trim().indexOf(" ");
stringToUse = stringToUse.slice(start).trim()
stringToUse.slice(0, end)

That works better or you can use Reg Expressions like the other answer stated.

edited Nov 19 '14 at 19:39

answered Nov 19 '14 at 19:27

Wes Duff

373
2
10

`rgb(192, 194, 194) 0 -10px 0px` And now? – Jonathan Nov 19 '14 at 19:29
The updated version handles both scenarios. Could be cleaned up a little for sure, but it works. – Wes Duff Nov 19 '14 at 19:40

score 0 · Answer 3 · answered Nov 19 '14 at 19:29

Use Regexp match. You can find more at RegExp doc

var x = "rgb(1,2,3) 0px 10px -20px"
var y = x.match(/\) ([+-]?[0-9]*px)/)
var z = x.match(/\) ([+-]?[a-z]*px)/)
console.log("original=",x,"; good match=",y,"; no match=",z)
//prints
original= rgb(1,2,3) 0px 10px -20px ; good match= [") 0px", "0px"] ; no match= null

HTH. RegExp can do a lot more for you.

score 0 · Answer 4 · answered Nov 19 '14 at 19:40

Here's a regex example with some explanation:

var str = "rgb(192, 194, 194) -10px -10px 0px;";
var results = str.match(/.*\)\s?([^\s]*)/);

console.log(results); // ["rgb(192, 194, 194) -10px -10px 0px;", "-10px"]

To break it up:

*) Matches everything up until the first ")" it sees.
\s? Will optionally match a blank space.
([^\s]*)/) Will match everything up until but excluding the next blank space it sees. This is placed within a capturing group

This online regex app here better illustrates the above.

Thanks for everyones help. I appreciate the quick responses. — user1525766, Nov 19 '14 at 19:54

How to get value at a specific index In JavaScript?

4 Answers4

Update from question.