Trouble replacing text with JavaScript. Please help

Question

function $(id) { return document.getElementById(id); }

$('h').innerHTML.replace(/hello/g, "<span style='color: red;'>hello</span>");

It doesn't work. What happened?

Answer 1

replace返回一个字符串，并且不会自动将其分配给元素。

$('h').innerHTML = $('h').innerHTML.replace(/hello/g, "<span style='color: red;'>hello</span>");

Answer 2

replace() does not happen in-place; you need to assign the result to the destination you want:

var newText = $('h').innerHTML.replace(/hello/g, "<span style='color: red;'>hello</span>");
// Do something with newText

Answer 3

First of all, you don't need your first function, JQuery takes care of that automatically via a selector. Also, setting innerHTML should replace all the existing content of it anyway, so you don't need to explicitly state replace after that.

$('#h').html(/hello/g, "<span style='color: red;'>hello</span>");

Also, I think your quotes were wrong.

Answer 4

您没有将值分配回元素。

Answer 5

Try doing this:

function $(id) { return document.getElementById(id); }

$('h').innerHTML = $('h').innerHTML.replace("hello", "<span style='color: red;'>hello</span>");

fiddle: http://jsfiddle.net/maniator/LBAn6/