Render web code in a your page (javascript, html, ...)

HTML

• This example will output: One emoji Smiley (1F600) in a webcode

<webcode>
This is the HTML
<code html>
<span style="font-size:30pt">&#x1F600;</span>
</code>
Output:
</webcode>

• Result

This is the HTML

<span style="font-size:30pt">&#x1F600;</span>

Output:

Javascript

webcode supports javascript and captures the console call (log ¹⁾ and table ²⁾) to print them on the web page in a console area (Gray box).

Example:

<webcode>
  * in a javascript code block
<code javascript>
console.log("Javascript Code block");
</code>
  * and also in html code block
<code html>
<script>console.log("Html code block");</script>
</code>
  * The output of the console is also printed on the page.
</webcode>

The result is:

console.log("Javascript Code block");

<script>console.log("Html code block");</script>

Console.table

console.table ³⁾ is supported with an array of objects or primitives. There is no second argument.

Example:

<webcode>
    <code javascript>
        let tabularData = [
            {name: "foo", short: "f"},
            {name: "bar", short: "b"}
        ];
        console.table(tabularData);
    </code>
</webcode>

• This markup will output:

        let tabularData = [
            {name: "foo", short: "f"},
            {name: "bar", short: "b"}
        ];
        console.table(tabularData);
    

Across section

You can use webcode across section (ie with heading)

Example:

• the following markup

<webcode>
===== Javascript =====
```javascript
var colors = [ "blue", "green" ];
for (const [index, value] of colors.entries()) {
  console.log(index+", "+value+"\n");
}
```
===== Result =====
</webcode>

• will output:

Webcode Syntax

<webcode type name="A Name" width=100% height=250px>

    <!-- wiki syntax with css or html block code. -->
    All syntax are permitted between blocks

    <!-- css code block -->
    <code css>
    </code>

    <!-- html code block -->
    <code html>
    </code>

    <!-- javascript or babel code block -->
    <code javascript> <!-- or <code babel> -->
    </code>

    <!-- Wiki Markup -->
    <code dw>

    <!-- Code Block not displayed-->
    <code language [display="none"]>
    </code>

</webcode>

Security

To save this syntax, you need to be:

• an admin
• or a Designer

Parsing problem?

The characters ''<, >, ", ', \, and &'' should be escaped in string literals.

Example:

• In the below literal, the character / should be escaped

let fragment = '</script>';

• The right way is to write it:

let fragment = '<\/script>';

Why? Because the code is executed on the HTML page, they will interfere with the HTML parser.