¶ Edit

X Delete

11085 views

8 years ago

Printing Text and HTML

This section will get you started with displaying text and HTML on your app's page.

Here's the famous "Hello World" example:

print("Hello World Wide Web!");

To print multiple lines of text, a quick way is printp, meaning "print paragraph."

printp("Some facts are worth committing to memory.");
printp("For example: 4 + 2 < 7.");
printp("The status of this particular fact is: ",(4+2 < 7)); // true

Printing HTML

By default, the print command makes your text "html-safe", so it shows up the way it looks in your code. That's why the open angle-bracket above in 4 + 2 < 7 didn't wipe out the rest of the document!

Here's a way to print raw HTML code, using the html function and multi-line strings (an AppJet extension to JavaScript).

print(html("""
<p>Some facts are worth committing to memory.</p>
<p>For example: 4 + 2 < 7.</p>
<p>The status of this particular fact is: """+
    (4+2 < 7)+"</p>")); // true

A better way to print HTML (we think) is to use our "tags" library.

Tags Library

The tags library has a function for each HTML tag.

print(H1("Things That Make Me Happy"));

print(P("A partial list."));

print(UL(LI("Ice cream"),
     LI("The sound of the ocean"),
     LI("That song by Bobby McFerrin"),
     LI("The movie ",I("Gone with the Wind")),
     LI("Elegant code"),
     LI("The color ",SPAN({style:"color:green"},"green"))));

As the above example shows, you can set the attributes of a tag (like color) by passing a JavaScript object as the first argument.

You can also treat a tag like a JavaScript array (it has all the same methods) and add to it programmatically.

var list = UL();

list.push(LI("One item"));
list.push(LI("Two item"));

["Red","Blue"].forEach(
  function(color) {
     list.push(LI(color+" item"));
  }
);

printp("The following "+list.length+" items may be of interest.");
print(list);
Powered by AppJet on JGate
source
rendered in 0.167s