JSDoc adding real code in documentation

@example http://code.google.com/p/jsdoc-toolkit/wiki/TagExample

/**
 * This function does something see example below:
 * @example
 * var x = foo("test"); //it will show "test" message
 *
 * @param {string} str: string argument that will be shown in message
 */
function foo(str)
{
   alert(str);
}

Use

<pre><code>

....

</code></pre>

This is whats used in many official docs, and will for instance receive syntax hightlighting with some tools


Jsdoc3 has a markdown plugin but it is turned off by default. Enable it the default config file ./node_modules/jsdoc/conf.json.EXAMPLE via ...

"plugins": [
    "plugins/markdown"
],

... and you have nice syntax support for docs, including for code. Markdown uses three backticks (```) to demarcate code blocks. For to use the original example:

/**
* This function does something see example below:
* ```
* var x = foo("test"); //it will show "test" message
* ```
* @param {string} str: string argument that will be shown in message
*/

You can put any HTML in JSDoc and it will be copied out. Heres an example of what I use:

/** 
 * The ReplaceSlang method replaces the string &quot;hi&quot; with &quot;hello&quot;.
 *   <script language="javascript">
 *     function testFunc() {
 *       alert(ReplaceSlang(prompt("Enter sample argument")));
 *     }
 *   </script>
 *   <input type="button" value="Test" onclick="testFunc()" />
 * @param {String} str The text to transform
 * @return {String}
 */
exports.ReplaceSlang = function(str) {
  return str.replace("hi", "hello");
};

To make sure the button is not in the summary, add a sentence and a dot (.) before it.

You need to find some way to include your javascript file in the output of JSDoc so that they are loaded. (Your code otherwise does not exist as javascript in the output of JSDoc – you can modify the template for that : see JsPlate documentation)