Survey
* Your assessment is very important for improving the work of artificial intelligence, which forms the content of this project
Download WK09
Document related concepts
no text concepts found
Transcript
Week 9
Today’s Objectives
Announcements
•
Homework 2 is due next week at 7:00 p.m.
•
Last day to drop or withdraw from a fall class is 27-Oct
Team assignments for Homework #3 – Create an online
book store web app with ASP.NET and C#
•
The third homework assignment is a team project, and each team
must have four members.
•
Each team gets a group account on dcm
Review midterm exam
JavaScript (continued)
1
Midterm Exam
Please return your exam papers today
2
Midterm Exam
Question 9
Write the XHTML code for the following table. Write only the code for the
table, not the code for an entire page. Hint: The table width is 240.
<table border="1" width="240">
<tr>
<td colspan="2">Sandwiches</td>
</tr>
<tr>
<td>Ham and Swiss</td><td align="right">$7.99</td>
</tr>
<tr>
<td>Gyro</td><td align="right">$7.99</td>
</tr>
</table>
3
Midterm Exam
Question 11
Assuming that the files for your Web site are stored in the directories shown in the figure,
write the XHTML code that you would put in the file named “deli.html” in order to display
the image in “poorboy.jpg” that is 200 pixels wide by 100 pixels high. Hint: Remember to
make the image accessible for screen readers.
pages
index.html
HW2
deli.html
menu.html
images
poorboy.jpg
burger.jpg
stylesheets
deli.css
scripts
deli.js
<img src="images/poorboy.jpg" height="100" width="200" alt="Poorboy"/>
4
Midterm Exam
Question 21
Write the CSS rule that would appear in the external style sheet in order to display the text
shown in the screen shot from the HTML source also shown above. Hint: The text font is
Arial, italic, size 36.
<span id="greeting">Hello</span>
#greeting {
font-family:Arial;
font-style:italic;
font-size:36;
}
5
Midterm Exam
Question 25
If “Charles Moen” is entered in the text field, as shown, and the form is submitted, what will
be the URL submitted (including the query string, if any).
<html>
<body>
<form method="get" action="welcome.aspx">
<input type="text" name="name"/>
<br/>
<input type="hidden" name="location" value="UHCL"/>
<input type="submit"/>
</form>
</body>
</html>
http://dcm.uhcl.edu/moen/welcome.aspx?name=Charles+Moen&location=UHCL
6
Midterm Exam
Question 29
Create an XML file that contains information about the textbook that we will use for this
course during the second half of the semester. Your XML file must conform to the DTD.
Hint: Your XML file must contain only the information specified by the DTD.
<!ELEMENT
<!ELEMENT
<!ATTLIST
<!ELEMENT
<!ELEMENT
<!ELEMENT
<!ELEMENT
booklist (book)+>
book (title,author)>
book yearpublished CDATA #REQUIRED>
title (#PCDATA)>
author (firstname,lastname)>
firstname (#PCDATA)>
lastname (#PCDATA)>
MacDonald, Matthew. Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second
Edition. Apress, 2007. ISBN 978-1-59059-891-7
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE booklist SYSTEM "booklist.dtd">
<booklist>
<book yearpublished="2007">
<title>Beginning ASP.NET 3.5 in C# 2008: From Novice to Professional, Second Edition</title>
<author>
<firstname>Matthew</firstname>
<lastname>MacDonald</lastname>
</author>
</book>
</booklist>
7
Midterm Exam
Question 32
The screen shot shows the output from a JavaScript function that calculates the user’s age on their
birthday in the current year. In the space below, write a JavaScript function that calculates the age by
using the birth year that is input by the user. Your function must get the birth year that was input by the
user from the form, calculate their age on their birthday in the current year, and insert the result into the
appropriate text field on the form, as shown in the screen shot.
<input type="text" name="birth" id="birthid"/>
<input type="text" name="age" id="ageid"/>
var today = new Date();
var current_yyyy = today.getFullYear();
function calculateAge() {
var birthyear = document.getElementById("birthid").value;
var age = current_yyyy - birthyear;
document.getElementById("ageid").value = age;
}
8
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Calculator</title>
<style type="text/css">
#error { color:red; }
</style>
<script type="text/javascript">
function compute() {
var number = document.getElementById("numberid").value;
if (!number.match(/^\d+$/)) {
document.getElementById("error").innerHTML = "Please enter a number!";
document.getElementById("squareid").value = "";
document.getElementById("cubeid").value = "";
}
else {
document.getElementById("error").innerHTML = "";
document.getElementById("squareid").value = number * number;
document.getElementById("cubeid").value = number * number * number;
}
}
</script>
</head>
<body>
<form method="get" action="#" onsubmit="compute();return false;">
<p>
<label for="numberid">Enter an integer: </label><input type="text" name="number" id="numberid"/>
<span id="error"></span>
</p>
<p>
<input type="submit" value="Compute"/>
</p>
<p>
<label for="squareid">Square: </label><input type="text" name="square" id="squareid"/>
</p>
<p>
<label for="cubeid">Cube: </label><input type="text" name="cube" id="cubeid"/>
</p>
</form>
</body>
</html>
Question 33
9
Progress Review
Progress Review
So far, we have learned…
Basics
Internet and the World Wide Web; URL; Web design evolution;
Accessibility and usability; Web 2.0
HTML and XHTML
HTML elements and markup tags; W3C validation; HTML forms
CSS
Stylesheets and properties
XML
Representing data with XML; Well-formedness; DTDs
HTTP
HTTP Request; Parameter passing
JavaScript
Core language; DOM; Regular expressions
Client-side development – when and how to use these technologies
11
Progress Review
Next…
JavaScript
•
Events and event handling
•
DHTML
•
Cookies
HTTP
•
Response
Server-side development
•
ASP.NET
•
C#
•
Sessions
•
Database access with ADO
12
Related documents