need help replace function javascript

Question

I have a HTML site and have to replace a string in it.
The code looks like this:

<div class="field field_text field_name_manufacturer_key_number field_value_50-000">    
    <div class="label">    
        Herstellerschlüsselnummer   
    </div>
    <div class="label">    
        50.000    
    </div>
</div>

I want to only change the string above "Herstellerschlüsselnummer" and the rest have to be untouched

With JavaScript looks like this but it doesn't work and I don't know why

document.getElementsByClassName("field_name_manufacturer_key_number")["0"].innerHTML.replace('Herstellerschlüsselnummer','inkl. Kilometer');

Can someone tell me how do I can manage this? and no, I cant change the HTML or the fields in MYSQL or PHP :) etc.

T.J. Crowder · Accepted Answer · 2014-03-28 11:35:33Z

2

The replace function returns the string with the replacements made, so you have to assign that to something. In your case, perhaps:

If you have just one element matching the class, you can do this:

var element = document.querySelector(".field_name_manufacturer_key_number");
element.innerHTML = element.innerHTML.replace('Herstellerschlüsselnummer','inkl. Kilometer');

(querySelector accepts a CSS selector. It has better support than getElementsByClassName, it returns the first match rather than a list, so no [0] needed. The equivalent that gets a list [if you want that for something else at some point] is querySelectorAll.)

answered Mar 28, 2014 at 11:35

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

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

Comments

simich · Accepted Answer · 2014-03-28 11:56:16Z

You can to this in various ways mostly depending on the minimum browser versions you are targeting, specifically IE. jQuery obviously provides the easiest way but if you don't use its other capabilities, it is an overkill to include it just for the task. Anyway, you can use jQuery for all versions of IE:

$(".field_name_manufacturer_key_number .label").eq(0).text("inkl. Kilometer");

IE 8+ (no jQuery)

var element = document.querySelector(".field_name_manufacturer_key_number .label");
element.textContent = "inkl. Kilometer";

IE 9+ (no jQuery)

var parent = document.getElementsByClassName("field_name_manufacturer_key_number")[0],
    child = parent.getElementsByClassName("label")[0];
child.textContent = "inkl. Kilometer";

etc.

Silas Hansen · Accepted Answer · 2014-03-28 11:35:21Z

0

You need to set/overwrite the innerHTML after placing it:

document.getElementsByClassName("field_name_manufacturer_key_number")["0"].innerHTML = 
document.getElementsByClassName("field_name_manufacturer_key_number")["0"].innerHTML.replace('Herstellerschlüsselnummer','inkl. Kilometer');

answered Mar 28, 2014 at 11:35

Silas Hansen

1,7492 gold badges17 silver badges25 bronze badges

Collectives™ on Stack Overflow

need help replace function javascript

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related