How to replace a className part with JavaScript Regex?

Question

I've a simple divwith various class attributs:

<div id="divId" class="anInformationIWantToGet aClassUsedForCss"></div>

I want to programatically get the anInformationIWantToGet class which vary, the problem should be easy because others classes are known, so a Regex like following should do the job:

var anInformationIWantToGet  = div.className.replace(/(\s*(aClassUsedForCss)?\s*)/, '');

But it doesn't work and I don't understant why... What did I miss?

I create a Fiddle to test the problem.

PS : my browser is Firefox17.

@Quentin I completely agree, but it's not in my hands unfortunately... — Fractaliste
– Fractaliste, Commented May 5, 2015 at 11:53
@RGraham Because I thought I could to it with 1 line with Regex. If I found no good solution I'll loop over classList, sure. — Fractaliste
– Fractaliste, Commented May 5, 2015 at 11:55
One hint from me: never write a regex all parts of which are optional. Use anchors at least, e.g.: \s*(?:hover)?\s*$ — Wiktor Stribiżew
– Wiktor Stribiżew, Commented May 5, 2015 at 11:58

saikiran.vsk · Accepted Answer · 2015-05-05 11:54:13Z

1

Try this Change you below code

var anInformationIWantToGet  = div.className.replace(/(\s*(aClassUsedForCss)?\s*)/, '');

To

var anInformationIWantToGet  = div.className.replace(/(\s*(aClassUsedForCss)?\s*)/g, '');

put g in regular expression.

And working updated fiddle

Ask for more, If above is not working/Understood.

answered May 5, 2015 at 11:54

saikiran.vsk

1,7961 gold badge10 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Quentin · Accepted Answer · 2015-05-05 11:56:59Z

0

/(\s*(aClassUsedForCss)?\s*)/
                       ^

You've made the class name you are looking for optional, so the first match will be the 0 or more white space at the beginning of the string.

Remove the ? and/or make it a global regex (by appending g).

answered May 5, 2015 at 11:56

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

Comments

wallop · Accepted Answer · 2015-05-05 12:04:39Z

0

This will work

FiddleChanged

function replaceClass(){
    /* Should not output 'hover' */
   var reqdClasName = div.className.match(/(\S*)\s*hover\s*/)[1];
   div.className.replace(reqdClasName, '');
   result.innerHTML = reqdClasName;   
}

Oops i had missed the replacing part. I ve updated

UpdatedFiddle

edited May 5, 2015 at 12:04

answered May 5, 2015 at 11:57

wallop

2,6011 gold badge29 silver badges39 bronze badges

Comments

andale · Accepted Answer · 2015-05-05 12:25:34Z

0

Be aware of replacing white spaces. Try this example.

var anInformationIWantToGet  = div.className.replace(/(\s*(?:aClassUsedForCss)\s*)/, ' ').trim();

Correct example.

answered May 5, 2015 at 12:25

andale

4732 silver badges13 bronze badges

Comments

Lakhan · Accepted Answer · 2015-05-05 13:05:09Z

0

We will also change it by just adding class which we required and remove the remaining like that way.

$("#myDiv").attr("class","aClassUsedForCss");

FIDDLE DEMO

edited May 5, 2015 at 13:05

answered May 5, 2015 at 12:55

Lakhan

13.5k3 gold badges21 silver badges29 bronze badges

Collectives™ on Stack Overflow

How to replace a className part with JavaScript Regex?

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related