[RESOLVED] JavaScript replace html code

**meek** · 01-21-2010 07:08 AM

Hi.

I have a few lines of code which I would like to be able to change. I can only do it client side, so I'm thinking a javaScript replace function might do the trick.

Basically, I have a code like this:

HTML Code:

<table border="1" cellpadding="0" class="my_table">
  <tr>
    <td>Text</td>
  </tr>
</table>

I would like to change border="1" into border="0" - how do I do that?

I have played with this code:

Code:

<script type="text/javascript">
function replace_stuff() {
document.body.innerHTML = document.body.innerHTML.replace(/border="1"/g,'border="0"');
}
</script>

but it doesn't work in IE. (When replacing ordinary words with this script, it works fine in Firefox and IE...is it an escaping issue or should it be done in another way?)

Can anybody help me out?

Thanks.

**Declan1991** · 01-21-2010 08:25 AM

document.getElementById("give_the_table_an_id").border = "1";
innerHTML and tables don't go well together in IE as far as I remember.

**meek** · 01-21-2010 08:42 AM

Hi.

That seems to do what I'm looking for. It works in both Firefox and Internet Explorer. Only thing is - I only have access to a class on that table, not an id. Can the script be changed to work with a class instead of an id?

Regards.

**hoangkc** · 01-21-2010 08:53 AM

Try this function

Code:

/*
 * $TagClass
 * Find and return elements which belong to parent element and have className, tag match search conditions
 * $TagClass("className",parent,"input")
 */
$TagClass = function(className, parent, tag)
{
	tag = tag||"*";
	parent = parent||document.body;
	var children = parent.getElementsByTagName(tag);
	var elements = [], child, pattern = new RegExp("(^|\\s)" + className + "(\\s|$)");
	for (var i = 0, length = children.length; i < length; i++)
	{
		child = children[i];
		var elementClassName = child.className;
		if (elementClassName.length == 0) continue;
		if (elementClassName == className || elementClassName.match(pattern)) elements.push(child);
  	}
  	return elements;
}

**meek** · 01-21-2010 11:58 AM

Hi and thank you for your help. Much appreciated.

I'm not an expert, so could you also tell me how to use it, please?

Thanks.

**Declan1991** · 01-21-2010 12:00 PM

I'd use Ultimate getElementsByClassName despite the name, if you intend on doing this much. If the first table with that class name, use

Code:

getElementsByClassName("whateverIsTheClass","table")[0].border = 1;

If the first element on the page with that class name, use

Code:

getElementsByClassName("whateverIsTheClass")[0].border = 1;

The number in square brackets can be changed to refer to the second etc.

**meek** · 01-22-2010 03:55 AM

@Declan1991 - thanks, this looks like a brilliant solution. I have inserted the script in the <head> of my page, but where in the script do I put his line?

Code:

getElementsByClassName("login-headline","table")[0].border = 0;

So basically, I don't know how to run the script... Can you help me out?

**Declan1991** · 01-22-2010 12:40 PM

Copy and paste his function into where ever you have your JavaScript. Maybe have it as the first thing in the file. Then your function. Something like

Code:

<script type="text/javascript">
/* His code
...
...
*/
function replace_stuff () {
// Your code
}
</script>

**meek** · 01-25-2010 03:35 AM

Thanks a million! It works perfectly. You have been a great help.

Thanks again.

Thread: [RESOLVED] JavaScript replace html code

Thread Tools

Display

[RESOLVED] JavaScript replace html code

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions