Переписывание содержимого элемента HTML с использованием JavaScript

Question

Я новичок в JS, не могу понять, как заставить этот код работать. Я пытаюсь переписать весь HTML-текст.

var oldSource = document.documentElement.innerHTML; 
alert(oldSource); //this works, it gets the whole html 

document.write(Change(oldSource)); //doesn't work, writes undefined 

    function Change(source){ 
    for (i = 0; i <= source.length; i++){ 
    source[i] = "S"; // doesn't change the source[i] 
    } 
} 

Answer 1

Вы меняете значение переменной oldSource, а не значение documentElement.innerHTML.

.innerHTMLjust returns a string that contains the serialised content of that element. Он не возвращает ссылку на контент в DOM.

Кроме того, document.write(Change(oldSource)) говорит написать возвращаемое значение Change(oldSource) к документу ... но ваша Change() функция не возвращает ничего, следовательно, undefined.

И, наконец, строки неизменяемы, то есть вы не можете изменить их содержимое после их создания. Вместо этого вы должны создать новую строку в функции, например, так:

function Change(source){ 
    new_source = "" 
    for (i=0; i < source.length; i++){ 
    new_source = new_source + "S"; //doesn't change the source[i] 
    } 
    return new_source 
} 

You can check all of this out in this jfiddle.

Answer 2

Вы должны return(source); после для цикла

Answer 3

В JavaScript этой строке: var oldSource = document.documentElement.innerHTML; копирует innerHTML в переменную oldSource. Он не сохраняет ссылку на innerHTML.

Вы изменяете значение, хранящееся в oldSource, но не применяя его к документу.

В вашей функции Change вы не возвращаете никакого значения - именно поэтому вы получаете undefined. Добавить источник возврата; in your Измените функцию, чтобы вернуть значение.

Другая проблема заключается в том, что вы не можете изменить строку в JavaScript. Для этого вам нужно создать новую переменную. Вы не можете редактировать source[i] - вы можете получить только то значение, которое там есть.

Answer 4

Строки JavaScript неизменяемы. Вы не можете использовать

source[i]="S"; 

, чтобы изменить строку. Вам нужно построить новую строку и вернуть ее.

Это также должно быть < source.length.

Answer 5

1. ваша функция должна return что-то, а не просто изменить
2. вы не можете изменить строки таким образом, использовать .replace() метод вместо
3. , если вы укажете, что вы действительно нужно сделать, наша помощь может быть более эффективным

EDIT насколько я не нашел правильный рабочий код здесь, я хочу предложить мой один

function Change(source){ 
    var str = source.split(""); 
    for (var i=0; i<source.length; i++){ 
    str[i] = "S"; 
    } 
    return str.join(""); 
} 

Возможно, это не самый быстрый способ (хотя, почему бы и нет), но он позволяет вам работать с индексами, как вы пробовали в своем вопросе.

working fiddle для Lego Stormtroopr

edit2 и this example показывает, как сделать это в одной строке внутри цикла (без создания дополнительных переменных)

for (var i=0; i<source.length; i++){ 
    source = source.replace(new RegExp(source[i]), "S"); 
    } 

Answer 6

Вы должны вернуть новый источник строка, как показано ниже;

var oldSource = document.documentElement.innerHTML; 
alert(oldSource); //this works, it gets the whole html 

document.write(Change(oldSource)); //doesn't work, writes undefined 

function Change(source){ 
    for (i=0; i<=source.length; i++){ 
     source[i]="S" 
    } 
    return source; 
}