How to replace content of javascript syntax highlighter?

Question

I'm using a javascript syntax highlighter (http://alexgorbatchev.com/SyntaxHighlighter/). I think this one is very famous.

in my js, I use ajax to get code samples and then initialize syntax highlighter. When I call the same ajax call with a different parameter, it returns a different code sample. The problem is that I can't replace syntax highlighter's content. I looked up its API list, but I can't find an API to update or replace its content.

Please advise me.

Just empty the wrapper element, put the new content inside, and then run syntax highlighter on that new code. — Šime Vidas
– Šime Vidas, Commented Oct 14, 2011 at 0:20
@ŠimeVidas // only problem with that is syntax highligher removes the wrapper element. — Moon
– Moon, Commented Oct 14, 2011 at 0:23
Then you need a wrapper wrapper :P Just wrap your content in another DIV. — Šime Vidas
– Šime Vidas, Commented Oct 14, 2011 at 0:26
@ŠimeVidas // That's a good idea. However...since syntax highlighter doesn't support a method to destroy it...I think there might be a memory issue if I simply empty the wrapper. — Moon
– Moon, Commented Oct 14, 2011 at 0:30
I don't believe there are. Afaik, Syntax Highlighter simply creates a DOM structure (a table with DIV's, etc.) based on your code block. When you remove that table from the DOM (for instance wrapper.innerHTML = '';), all those elements are garbage collected. — Šime Vidas
– Šime Vidas, Commented Oct 14, 2011 at 0:46

Šime Vidas · Accepted Answer · 2011-10-14 21:19:03Z

1

Just empty the wrapper element, put the new content inside, and then run syntax highlighter on that new code.

There shouldn't be any memory issues. Afaik, Syntax Highlighter simply creates a DOM structure (a table with DIV's, etc.) based on your code block. When you remove that table from the DOM (for instance wrapper.innerHTML = '';), all those elements are garbage collected.

answered Oct 14, 2011 at 21:19

Šime Vidas

187k66 gold badges290 silver badges392 bronze badges

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

4 Comments

P.Brian.Mackey Over a year ago

I had to set this up myself and found it to be non-trivial. For one, you cannot simply "run syntax highlighter" again as the class attribute gets wiped out with every iteration. The details of what I came up with can be found: stackoverflow.com/questions/15535448/…

Šime Vidas Over a year ago

@P.Brian.Mackey Aren't the classes set on the wrapper?

P.Brian.Mackey Over a year ago

The class can be set on any arbirtrary element so long as said element is of the type set by SyntaxHighlighter.config.tagName. Once an element is processed, the class is removed (in other words the brush is removed). shCore.cs requires all elements to have a brush, e.g. class=brush: csharp;. Once the element is processed, the brush is removed and that makes SyntaxHighlighter.Highlight() fail to discover the element on the next iteration. You can see this requirement on line 268 of shCore.js in findElements(). There's no brush because the class was removed so the code returns.

Šime Vidas Over a year ago

@P.Brian.Mackey Well, that's bad design then.

Collectives™ on Stack Overflow

How to replace content of javascript syntax highlighter?

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related