Link to home
Create AccountLog in
Avatar of hankknight
hankknightFlag for Canada

asked on

JavaScript: Replace  

Using JavaScript, how can I replace all " " with " SPACE " ?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
</head> 
<body> 

<h1 id="h">Hello &emsp; World &emsp; Testing</h1>

<script type="text/javascript">

// <![CDATA[

var h = document.getElementById('h').innerHTML;
var newText =  h.replace(/&emsp;/g,' SPACE ');
document.getElementById('h').innerHTML = newText;
// Should be Hello SPACE  World SPACE Testing
// ]]>

</script>

</body>
</html>

Open in new window

Avatar of hielo
hielo
Flag of Wallis and Futuna image

read comments in code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
<script type="text/javascript">// <![CDATA[
window.onload=function(){

	var h = document.getElementById('h');
	
	//this should reveal that the seventh character (which is the &emsp;) has a charCode of 8195
	//alert( h.innerHTML.charCodeAt(6))

	//so use that code to do the "replace"
	h.innerHTML =  h.innerHTML.split(String.fromCharCode(8195)).join(' SPACE ');

};
// ]]>

</script>
</head> 
<body> 

<h1 id="h">Hello &emsp; World &emsp; Testing</h1>



</body>
</html>

Open in new window

better approach:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
<script type="text/javascript">// <![CDATA[
window.onload=function(){
	removeChar('&emsp;', 'h')
}

function removeChar(ch,container){
	var s=document.createElement('span');
	s.innerHTML=ch;
	s.style.position='absolute'
	s.style.left='-100em';
	var b =document.getElementsByTagName('body')[0];
	b.appendChild(s);
	var h = document.getElementById(container);
	h.innerHTML = h.innerHTML.split(s.innerHTML).join(' SPACE ');
	b.removeChild(s);
}
// ]]>

</script>
</head> 
<body> 

<h1 id="h">Hello &emsp; World &emsp; Testing</h1>



</body>
</html>

Open in new window

actually, you should pass the replacement string as well:
window.onload=function(){
	removeChar('&emsp;',' SPACE ', 'h')
}

function removeChar(searchFor,replaceWith,SearchIn){
	var s=document.createElement('span');
	s.innerHTML=searchFor;
	s.style.position='absolute'
	s.style.left='-100em';
	var b =document.getElementsByTagName('body')[0];
	b.appendChild(s);
	var h = document.getElementById(SearchIn);
	h.innerHTML = h.innerHTML.split(s.innerHTML).join(replaceWith);
	b.removeChild(s);
}

Open in new window

Avatar of hankknight

ASKER

Is there a way to do this using regex with .replace() ?
>>Is there a way to do this using regex with .replace()
yes:
h.innerHTML = h.innerHTML.replace( new RegExp(s.innerHTML,"g"), replaceWith);

but for efficiency reasons, you are advised to use split/join since you are looking for a very specific character.  Regex should be used when looking for "patterns".
Is there a way to do use replace like this?  (the code below does not work)

h.replace(/String.fromCharCode(8195)/g,' SPACE ')

Open in new window

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
</head> 
<body> 

<h1 id="h">Hello &emsp; World &emsp; Testing</h1>

<script type="text/javascript">

// <![CDATA[

var h = document.getElementById('h').innerHTML;
var newText =  h.replace(/String.fromCharCode(8195)/g,' SPACE ');
document.getElementById('h').innerHTML = newText;
// Should be Hello SPACE  World SPACE Testing
// ]]>

</script>

</body>
</html>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of hielo
hielo
Flag of Wallis and Futuna image

Link to home
membership
Create a free account to see this answer
Signing up is free and takes 30 seconds. No credit card required.
See answer