CGI html標籤學習

 1.上次講過了CGI的編程風格，今天來講一下，怎麼創建HTML的一些標籤。

首先要組存一個完整的HMTL頁面，標籤是少不了的。

 

#!/usr/bin/perl -w
use CGI qw(:standard);

print
    header(-charset=>'utf8'),
      start_html(-title=>'Test page'),
        h1('Simple Test'),
        ul(li({-type=>'disc'},['Sneezy','Doc','Sleepy','Happy'])),
        ol({compact=>undef},li('one'),li('two'),li('three')),
        table({-border=>undef},caption('When Should You Eat Your Vegetables?'),
        Tr({-align=>'CENTER',-valign=>'TOP'},[
        th(['Vegetable', 'Breakfast','Lunch','Dinner']),
        td(['Tomatoes' , 'no', 'yes', 'yes']),
        td(['Broccoli' , 'no', 'no', 'yes']),
        td(['Onions' , 'yes','yes', 'yes'])])),p,
        checkbox_group(-name=>'words',-values=>['eenie','meenie','minie','moe'],-defaults=>['eenie']),p,
        "What's your favorite color?",
        popup_menu(-name=>'color',-values=>['red','green','blue','chartreuse']),p,
        textfield(-name=>'field_name',-default=>'starting value',-override=>1,-size=>50,-maxlength=>80),p,
        filefield(-name=>'uploaded_file',-default=>'starting value',-size=>50,-maxlength=>80),p,
        scrolling_list('list_name',['eenie','meenie','minie','moe'],['eenie','moe'],5,'true',{'moe'=>{'class'=>'red'}}),p,
        radio_group(-name=>'group_name',-values=>['man','woman','child','girls'],-rows=>'2',-columns=>'2'),p,
        image_button(-name=>'button_name',-src=>'../icons/up.png',-align=>'MIDDLE'),p
        button(-name=>'button_name',-value=>'user visible label',-onClick=>"response()"),p,
        img{src=>'../icons/upload/RHEL6_720x60.png',align=>'LEFT'};
      end_html;

這裏講了HTML的一些標籤,上面用的是function-oriented style來創建的，下面用object-oriented style 來創建這些HTML標籤。

 

#!/usr/bin/perl -w
use CGI;
use strict;

my $q = new CGI;

print
     $q->header(-charset=>'utf8'),
        $q->start_html(-title=>'Test Page'),
            $q->h1('Simple Test'),
            $q->ul($q->li({-type=>'disc'},['Sneezy','Doc','Sleepy','Happy'])),
            $q->ol({compact=>'undef'},$q->li('one'),$q->li('two'),$q->li('three')),
            "When Should You Eat Your Vegetables?",
            $q->start_table({-border=>undef}),
                $q->start_Tr({-align=>'CENTER',-valign=>'TOP'}),
                    $q->start_th,
                    "Vegetable",
                    $q->end_th,
                    $q->start_th,
                    "Breakfast",
                    $q->end_th,
                    $q->start_th,
                    "Lunch",
                    $q->end_th,
                    $q->start_th,
                    "Dinner",
                    $q->end_th,
                $q->end_Tr,
                $q->start_Tr,
                    $q->start_td,
                    "Tomatoes",
                    $q->end_td,
                    $q->start_td,
                    "no",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                $q->end_Tr,
                $q->start_Tr,
                    $q->start_td,
                    "Broccoli",
                    $q->end_td,
                    $q->start_td,
                    "no",
                    $q->end_td,
                    $q->start_td,
                    "no",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                $q->end_Tr,
                $q->start_Tr,
                    $q->start_td,
                    "Onions",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                    $q->start_td,
                    "yes",
                    $q->end_td,
                $q->end_Tr,
            $q->end_table,$q->p,
        $q->checkbox_group(-name=>'words',-values=>['eenie','meenie','minie','moe'],-defaults=>['eenie']),$q->p,
        "What's your favorite color?",$q->popup_menu(-name=>'color',-values=>['red','green','blue','chartreuse']),$q->p,
        $q->textfield(-name=>'field_name',-default=>'starting value',-override=>1,-size=>50,-maxlength=>80),$q->p,
        $q->filefield(-name=>'uploaded_file',-default=>'starting value',-size=>50,-maxlength=>80),$q->p,
        $q->scrolling_list('list_name',['eenie','meenie','minie','moe'],['eenie','moe'],5,'true',{'moe'=>{'class'=>'red'}}),$q->p,
        $q->radio_group(-name=>'group_name',-values=>['man','woman','child','girls'],-rows=>'2',-columns=>'2'),$q->p,
        $q->image_button(-name=>'button_name',-src=>'../icons/up.png',-align=>'MIDDLE'),$q->p,
        $q->button(-name=>'button_name',-value=>'user visible label',-onClick=>"response()"),$q->p,
        $q->img({-src=>'../icons/upload/RHEL6_720x60.png',-align=>'LEFT'}),
        $q->end_html;