HTML, CSS and JS Exam Questions
HTML, CSS and JS Exam Questions
([SODLQWKHGLIIHUHQFHEHWZHHQD+70/LGDWWULEXWHDQGD+70/FODVVDWWULEXWH
>@
E 7KHKWPOILOHLVOLQNHGWRWKH&66ILOHstyle.css
7H[WEHWZHHQh1WDJVVKRXOGEHLQWKHIRQW$ULDO
7KHFXVWRPHUTXRWHVKRXOGEHRQDEDFNJURXQGZLWKWKHFRORXU(&(
7KHLQWURGXFWLRQWH[WVKRXOGEHGDUNUHGXVLQJWKHQDPHGFRORXUGDUN5HG
:ULWHWKHFRGHWKDWVKRXOGJRLQstyle.cssWRJLYHWKLVIRUPDWWLQJ
h1{
font-family: Arial;
}
.customerQuote{
background: E8C3E1;
}
#intro{
color: darkRed;
}
>@
F 7KHFRGHEHWZHHQWKHscriptWDJVLVVXSSRVHGWRGLVSOD\DGLIIHUHQWPHVVDJHGXULQJWKHVKRSಫVRSHQLQJKRXUV
RIDQG
L 6WDWHWKHQDPHRIWKHODQJXDJHXVHGEHWZHHQWKHscriptWDJV
javascript >@
6RPHXVHUVKDYHUHSRUWHGWKDWWKHUHLVDEXJDQGWKHVLWHVD\VWKHVKRSLVFORVHGZKHQWKH\ORJRQ
EHWZHHQDQGLQWKHPRUQLQJ
LL ([SODLQKRZWKLVEXJFDQEHIL[HG
>@
LLL *LYHRQHGLVDGYDQWDJHRIWKLVFRGHEHLQJUXQFOLHQWVLGHUDWKHUWKDQVHUYHUVLGH
7KH%LJ%UDLQVH[DPERDUGKDVSURGXFHGDZHEVLWHWKDWDOORZVVWXGHQWVWRDFFHVVUHYLVLRQYLGHRV
$OOSDJHVLQWKHVLWHFRQWDLQWKHIROORZLQJWDJLQWKHKHDGVHFWLRQ
'HVFULEHRQHDGYDQWDJHRIVWRULQJWKH&66LQDQH[WHUQDOILOHUDWKHUWKDQLWEHLQJHPEHGGHGZLWKLQ+70/ILOHV
WKHVLWH
VRZQHUZDQWVWRDGGWKHSKRWR8.VWDPSVMSJLQSODFHRIWKHFRPPHQW
7KHVLWHXVHVVW\OLQJVHWRXWDVDWWULEXWHVLQWDJVUDWKHUWKDQDOLQNHG&66ILOH
L *LYHRQHGLVDGYDQWDJHRIWKLVWRWKHVLWH
VRZQHU
The colour change has to be implemented for all the webpages. It needs a
lot of work to keep the look of page consistent.
>@
LL *LYHRQHGLVDGYDQWDJHRIWKLVWRWKHVLWH
VYLVLWRUV
The site will be much slower to access
>@
D $ZHEVLWHKDVWKHIROORZLQJFRGH
:ULWHWKHVHJPHQWRI&66FRGHWKDWZRXOGDSSHDURQWKHVW\OHVKHHWWRPDNHWKHPHVVDJHDSSHDULQWKHZD\
GHVFULEHG
#warning {
color: red;
font-family: monospace;
}
>@
E ([SODLQWKHPHDQLQJRIWKH+70/OLQH
The HTML line creates an input field where the user can enter data in this case the username
>@
F
7KHOLQH VHQGVWKHFRQWHQWVRIWKHIRUPWREHSURFHVVHGE\WKH
VHUYHU7KLVLVGRQHE\FRGHZULWWHQLQDODQJXDJHFDOOHG3+3ZKLFKLVGHVLJQHGIRUVHUYHUVLGHSURFHVVLQJ
&RQYHUVHO\-DYD6FULSWLVWUDGLWLRQDOO\XVHGIRUFOLHQWVLGHSURFHVVLQJ
'LVFXVVWKHGLIIHUHQFHEHWZHHQVHUYHUDQGFOLHQWVLGHSURFHVVLQJZLWKUHVSHFWWRZHESDJHV<RXVKRXOGUHIHUWR
WKHDGYDQWDJHVGUDZEDFNVDQGEHVWXVHVRIERWKDSSURDFKHV
Client side processing describes situations where data is processed on the client computer
rather than on the server. This may happen because the client computer has specific
software that can process the information, or to lighten the load on the server’s processor.
Processing data on the client side can also improve security as it can avoid unnecessary
data transfer. For example a javascript is a client side language and is frequently used to
provide interactivity on a webpage. Client side processing can also adjust styles for
different platforms or screen sizes. Drawbacks of client side processing include code is
visible which means it can be copied. The browser may not run the code either because it
doesn’t have the capability or because the user has intentionally disabled client side code.
Server side processing: servers often process an enormous volume of data on behalf of
multiple clients. They can also process the data much faster than a client computer. There
are specific languages that are used for server side processing such as SQL or PHP. Search
requests (ex: for a search engine or a company database) may be sent to the server where
they may be applied to a database using SQL. Database search results are then sent back to
the client browser. Validation may also be carried out on the server where an invalid entry
must be compared with data already on a server database. Examples may include checking
user credentials, or looking up valid airport locations. JS may also be circumvented
maliciously so server side validation is important for the integrity of server data.
>@
3DUWRIWKHFRGHRQWKHVHUYHUFDQEHUHSUHVHQWHGLQSVHXGRFRGHEHORZ
,QWKHSVHXGRFRGH
RunSQL (A, B)UXQV64/VWDWHPHQWARQGDWDEDVHB,QWKLVFDVHLWZLOODOZD\VUHWXUQDVLQJOHYDOXH
valueFromForm (controlName)JHWVWKHYDOXHHQWHUHGLQWRWKHLQSXWFRQWUROZLWKWKHQDPHcontrolName
D $ZHEVLWHKDVWKHIROORZLQJ+70/FRGH
WKHVLWH
VRZQHUZDQWVWRDGGWKHSKRWR8.VWDPSVMSJLQSODFHRIWKHFRPPHQW
:ULWHWKHFRGHWKDWVKRXOGJRLQSODFHRIWKHFRPPHQW
>@
E :KHUHWKHFRPPHQW LVWKHVLWH
VRZQHUZDQWVWRDGGWKHWH[W
)LQGRXWPRUHDERXW8.VWDPSVDVDOLQNWRWKH8.6WDPS&ROOHFWRUV*XLOGZHEVLWHZKLFKKDVWKH85/
KWWSXNVWDPSFROOHFWRUVJXLOGFRXN
:ULWHWKHFRGHWKDWVKRXOGJRLQSODFHRIWKHFRPPHQW
>@
F 7KHVLWHQHHGVDOLJKWJUHHQZHEFRORXUOLJKW*UHHQEDFNJURXQG
([SODLQZKDWFKDQJHQHHGVWREHPDGHWRWKHFXUUHQWSDJHLQRUGHUWRGRWKLV
>@
/DVHU7DJLVDJDPHZKHUHWHDPVRISOD\HUVPRYHURXQGDQDUHQDVKRRWLQJHDFKRWKHUZLWKLQIUDUHGJXQV
3OD\HUVZHDUVHQVRUVWKDWNHHSWUDFNRIKRZPDQ\WLPHVWKH\KDYHEHHQKLWE\WKHODVHU7KLVLVNQRZQDVEHLQJ
ಪWDJJHGಫ
%HORZLVDQH[WUDFWIURPD/DVHU7DJFRPSDQ\ಫVZHEVLWH
7KHZHESDJHLVZULWWHQLQ+70/
:ULWHVRPH+70/FRGHZKLFKFRXOGKDYHEHHQXVHGWRSURGXFHWKLVH[WUDFW<RXFDQDVVXPHLWLVDOUHDG\LQVLGH
ERG\!WDJV
<h1> Reasons to Choose Us </h1>
<ul>
<li> State of the art equipment </li>
<li> Friendly staff </li>
<li> Match recordings available to purchase </li> >@
<li> Buy two games get one free </li>
</ul>
7KHIROORZLQJ-DYD6FULSWKDVEHHQIRXQGWRFUDVKFHUWDLQZHEEURZVHUV
j.toString()FRQYHUWVjWRDVWULQJ,WLVWKH-DYD6FULSWHTXLYDOHQWWRstr(j).
&RPSOHWHWKHWDEOHEHORZ
/LQH (IIHFWRI&RGH
3XVKHVtotalRQWRDVWDFNWKDWKROGVWKHEURZVHUಫVKLVWRU\
$WKHDWUHKDVDZHEVLWHVKRZLQJLWVSURGXFWLRQVDQGDOORZLQJSHRSOHWRPDNHERRNLQJV
3DUWRIWKHVLWHLVVKRZQEHORZ7KHZRUGVಪ%RRNWLFNHWVಫOLQNWRWKHSDJHಪERRNLQJVKWPOಫ
8SFRPLQJSURGXFWLRQV
0DFEHWK
%ORRG%URWKHUV
$Q,QVSHFWRU&DOOV
%RRNWLFNHWV
7KHWKHDWUHRIIHUVSULFHUHGXFWLRQVRQ7XHVGD\VDQG:HGQHVGD\V
7KHWKHDWUHPDQDJHUZDQWVVRPHWH[WRQWKHZHEVLWHWRGLVSOD\ಮ0LGZHHN6SHFLDOಥWLFNHWVWRQLJKWಯRQ
7XHVGD\VDQG:HGQHVGD\VDQGಮ7LFNHWVWRQLJKWಯRQDOORWKHUQLJKWV
7KHZHEVLWHFRGHUVZLOOXVHDGLYWDJZLWKWKHLG‘prices’WRGRWKLV7KH-DYDVFULSWFRGHWRFKDQJHWKH
FRQWHQWVRIWKHGLYWDJKDVEHHQVWDUWHGEHORZ7KHYDULDEOHdayCodeKROGVDQXPEHUUHSUHVHQWLQJWKHFXUUHQW
GD\RIWKHZHHNIRU6XQGD\IRU0RQGD\IRU7XHVGD\DQGVRRQ
&RPSOHWHWKH-DYDVFULSWFRGHEHORZVRWKHFRUUHFWPHVVDJHLVGLVSOD\HGLQDGLYWDJZLWKWKHLG‘prices’
if(dayCode == 2 OR dayCode == 3)
{
priceText="Midweek Special – tickets £15 tonight" ;
}
else
{
priceText="Tickets £20 tonight";
}
document.getElementById("prices").innerHTML= priceText;
= priceText;
>@
(1'2)48(67,213$3(5