SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Zealot
    Join Date
    Apr 2001
    Location
    home
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Including HTML in js files

    Is it possible to include HTML in .js files and use the .js files similar to SSIs?

    -Rob

  2. #2
    SitePoint Evangelist
    Join Date
    Jan 2002
    Posts
    420
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    do you mean something like this

    document.write('<html><head><title></title></head>\n');
    document.write('<body>\n');
    ...
    etc. etc.

    for example:
    http://www.okwoodexpo.com/registration/

    The form sends the inputs into a js file and returns it like an html file
    Wavelan

  3. #3
    SitePoint Zealot
    Join Date
    Apr 2001
    Location
    home
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmmmm.....actually, yes, I guess that is one way I could do it that I hadn't thought of....

    -Rob

  4. #4
    SitePoint Zealot
    Join Date
    Apr 2001
    Location
    home
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    is it possible to include quotation marks within the HTML if you include it in the document.write command, or do you have to escape them like you do in PHP?

    -Rob

  5. #5
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    you can also make css for js

    PHP Code:
    function c(color)
    {
        var 
    c    =    new Array;

        
    // if using hex include #

        
    c[0]    =    'black'//Header font colour
        
    c[1]    =    '#48535B'//Border colour and body text colour
        
    c[2]    =    '#D0D6DF'//Table background colour
        
    c[3]    =    '#BEC7D3'//Table Header background colour
        
    c[4]    =    '#A0A8C0'//Background colour

        
    if (color>c.length || color<|| color == nullalert('number less than\nnumber greater than\nor null');
        
        
    //keep adding in the following format and remember if using hex remember the #

        
    return c[color];
    }

    document.write ('<style>' +

            
    'body {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 8pt;' +
            
    'background:'            +    c(4)    +    ';'    +
            
    'margin:0pt; padding:0pt;'    +
            
    'scrollbar-face-color:'        +    c(3)    +    ';'    +
            
    'scrollbar-shadow-color:'    +    c(1)    +    ';'    +
            
    'scrollbar-highlight-color:'    +    c(1)    +    ';'    +
            
    'scrollbar-darkshadow-color:'    +    c(2)    +    ';'    +
            
    'scrollbar-track-color:'    +    c(2)    +    ';'    +
            
    'scrollbar-arrow-color:'    +    c(0)    +    ';'    +
            
    'scrollbar-3dlight-color:'    +    c(4)    +    ';'    +
            
    '}'    +

            
    'p {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    '}'    +

            
    'hr {'+
            
    'color:'        +        c(1)    +    ';'    +
            
    'height: 1pt;'    +
            
    '}'    +

            
    'a:link, a:visited, a:active {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'text-decoration: none;'+
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    'background: transparent;'    +
            
    'font-weight: bold;'    +
            
    '}'    +

            
    'a:hover {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(0)    +    ';'    +
            
    'background: transparent;'    +
            
    'text-decoration: overline underline;'    +
            
    '}'    +

            
    'font {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    '}'    +

            
    'td {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    '}'    +

            
    'td.tblList {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'border-bottom-width: thin;'    +
            
    'border-bottom-style: inset;'    +
            
    'border-bottom-color:'        +    c(3)    +    ';'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    '}'    +

            
    '.tblHeader {'    +
            
    'background-color:'    +        c(3)    +    ';'    +
            
    'color:'         +        c(0)    +    ';'    +
            
    'text-transform: capitalize;'    +
            
    'font-size: 10pt;'    +
            
    '}'    +

            
    '.tblMain {'    +
            
    'width: 756px;'    +
            
    'border: 1px solid '    +        c(1)    +    ';'    +
            
    'background-color:'    +        c(2)    +    ';'    +
            
    '}'    +

            
    '.navBar {'    +
            
    'width: 756px;'    +
            
    'border: 3px double '    +        c(1)    +    ';'    +
            
    'background-color:'    +        c(2)    +    ';'    +
            
    'padding-bottom: 3px;'    +
            
    'padding-top: 3px;'    +
            
    '}'    +

            
    '.tblQuote {'    +
            
    'background-color:'    +        c(3)    +    ';'    +
            
    '}'    +

            
    'a.navBarLink:link, a.navBarLink:visited, a.navBarLink:active {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'text-decoration: underline;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(0)    +    ';'    +
            
    'font-weight: bold;'    +
            
    '}'    +

            
    'a.navBarLink:hover {'+
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'text-decoration: none;'+
            
    '}'    +

            
    'font.fontQuote {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 8pt;'    +
            
    'font-style: italic;'    +
            
    '}'    +

            
    'font.fontBottom {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 8pt;'    +
            
    '}'    +

            
    'a.fontBottom:link, a.fontBottom:visited, a.fontBottom:active {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 8pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    'font-weight: bold;'    +
            
    '}'    +

            
    'a.fontBottom:hover {'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 8pt;'    +
            
    'color:'        +        c(0)    +    ';'    +
            
    'text-decoration: overline underline;'    +
            
    '}'    +

            
    'TEXTAREA {'    +
            
    'background-color:'    +        c(2)    +    ';'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    '}'    +

            
    'input {'    +
            
    'background-color:'    +        c(2)    +    ';'    +
            
    'color:'        +        c(1)    +    ';'    +
            
    'font-family: Verdana, Arial, Sans-Serif;'    +
            
    'font-size: 9pt;'    +
            
    '}'    +

            
    '</style>'); 

  6. #6
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes you do have to escape them with \

  7. #7
    SitePoint Zealot
    Join Date
    Apr 2001
    Location
    home
    Posts
    132
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    awesome, thank you everyone!

    -Rob

  8. #8
    SitePoint Evangelist
    Join Date
    Jan 2002
    Posts
    420
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hey andrew what do you mean make css for js?
    Wavelan

  9. #9
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I should of rephrased that really, but you can print it out and edit properties directly.

    eg

    PHP Code:
    this.style.width '10';
    //etc 


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •