createAttribute()
setAttribute()
removeAttribute()
getAttribute()
Internet Explorer 5
- ( STYLE) attributes. W3C , , oNode.attributes.align oNode.attributes["align"] ALIGN oNode. , HTML-. nodeName - , nodeValue - . specified , . , , oNode ALIGN , oNode.attributes["align"].specified true, , false.
setAttribute()
, , HTML, - () , setAttribute(). ID. ,
oNode.id= "newItem"
oNode.setAttribute("id","newItem")
oNode "newItem". setAttribute() . -- , . - , .
removeAttribute()
, removeAttribute(), . , . Internet Explorer 5, . , 0. true false .
getAttribute() .
<!-- pr32: -->
<html> <head>
<title>Checkbox Inspector</title>
<script type="text/javascript">
function inspectBox(form) {
if (form.checkThis.checked) {
alert("The box is checked.");
} else {
alert("The box is not checked at the moment.");
}
}
</script>
</head>
<body>
<form>
<input type="checkbox" name="checkThis" />Check here
<p><input type="button" name="boxChecker" value="Inspect Box"
onclick="inspectBox(this.form)" /></p>
</form>
</body> </html>
<!-- pr33: -->
|
|
|
<html>
<head>
<title>Radio Button onClick Handler</title>
<script type="text/javascript">
var ShempOPhile = false
function initValue() {
ShempOPhile = document.forms[0].stooges[3].checked;
}
function fullName(form) {
for (var i = 0; i < form.stooges.length; i++) {
if (form.stooges[i].checked) {
break;
}
}
alert("You chose " + form.stooges[i].value + ".");
}
function setShemp(setting) {
ShempOPhile = setting;
}
function exitMsg() {
if (ShempOPhile) {
alert("You like SHEMP?");
}
}
</script>
</head>
<body onload="initValue()" onunload="exitMsg()">
<form> <b>Select your favorite Stooge:</b>
<p><input type="radio" name="stooges" value="Moe Howard"
checked="checked" onclick="setShemp(false)" />Moe
<input type="radio" name="stooges" value="Larry Fine"
onclick="setShemp(false)" />Larry
<input type="radio" name="stooges" value="Curly Howard"
onclick="setShemp(false)" />Curly
<input type="radio" name="stooges" value="Shemp Howard"
onclick="setShemp(true)" />Shemp</p>
<p><input type="button" name="Viewer" value="View Full Name..."
lick="fullName(this.form)" /></p>
</form>
</body>
</html>
<!-- pr34: -->
<html> <head>
<title>Submit and Reset Confirmation</title>
<script type="text/javascript">
function allowReset() {
return window.confirm("Go ahead and clear the form?");
}
function allowSend() {
return window.confirm("Go ahead and mail this info?");
}
</script>
</head>
<body>
<form method="POST" enctype="text/plain"
action=mailto:[email protected] onReset="return allowReset()"
onsubmit="return allowSend()">
Enter your first name:<input type="text" name="firstName" />
<p>Enter your last name:<input type="text" name="lastName" /></p>
<p>Enter your address:<input type="text" name="address" /></p>
<p>Enter your city:<input type="text" name="city" /></p>
<p><input type="radio" name="gender" checked="checked" />Male <input type="radio" name="gender" />Female<<p>
<input type="checkbox" name="retired" />I am retired</p>
<p><input type="reset" /> <input type="submit" /></p>
</form>
</body>
</html>
JavaScript AJAX
AJAX (Asynchronous JavaScript And XML) -: , , . Google, GMail, Orkut, Google Groups, Google Maps, Google Suggest, Google Finance, AJAX-. :
|
|
|
DOM .
XML
XMLHttpRequest.
JavaScript.
- AJAX.
-:
- - .
- HTTP .
- - .
- .
AJAX:
- AJAX.
- web-.
- .
- , AJAX.
-AJAX, , .
- AJAX , XML.
- AJAX JavaScript, .
HTML-, . , DOM. XML , .
. XMLHttpRequest
XMLHttpRequest Microsoft Internet Explorer 5.0 ActiveX, JScript. Mozilla XMLHttpRequest. Apple, Opera .
XMLHttpRequest API (XMLHTTP), JavaScript, HTTP- -. XML, XMLHTTP . - XMLHttpRequest - Web-.
, open(), send().
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send(null); }
open() async .
async= true, send() . , . , , onreadystatechange XMLHttpRequest. readyState (readyState = 4 ), responseText responseXML.
XMLHttpRequest
abort() - ;
getAllResponseHeaders() - HTTP- ;
getResponseHeader(headerName) - ;
open(method, URL, async, userName, password) - , URL, ; async=true/false , ;
send(content) -
setRequestHeader(label, value) - HTTP- ;
XMLHttpRequest
onreadystatechange - , .
readyState - (0 , 1 , 2 , 3 , 4 ).
responseText - ; responseXML - XML, DOM
|
|
|
status - HTTP- (404 Not Found, 200 OK)
statusText - (Not Found, OK . .)
XMLHttpRequest
IE 5 - IE 6 XMLHttpRequest ActiveXObject, (IE 7, Mozilla, Opera, Safari) XMLHttpRequest. Internet Explorer IE7 :
var req = new ActiveXObject("Msxml2.XMLHTTP");
:
var req = new XMLHttpRequest();
:
function createRequestObject()
{
if (window.XMLHttpRequest) {
// window.XMLHttpRequest
try {
return new XMLHttpRequest();
} catch (e){}
} else if (window.ActiveXObject)
{ window.ActiveXObject
try {
return new ActiveXObject('Msxml2.XMLHTTP');
}
} catch (e){}
}
}
return null;
}
:
req.onreadystatechange = processReqChange;
req.open(<"GET"|"POST"|...>, <url>, <asyncFlag>);
.
. send().
GET- null :
req.send(null);
POST-, . POST- URL-escaped UTF-8 req.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded");.
. . , . :
function processReqChange()
{
try { // !
// "complete"
if (req.readyState == 4) {
// "OK"
if (req.status == 200) {
//
} else {
alert(" :\n" +
req.statusText);
}
}
}
catch(e) { }
}
AJAX-:
//JavaScript :
var req;
var reqTimeout;
function loadXMLDoc(url) {
req = null;
if (window.XMLHttpRequest) {
try {
req = new XMLHttpRequest();
} catch (e){}
} else if (window.ActiveXObject) {
try {
req = new ActiveXObject('Msxml2.XMLHTTP');
} catch (e){
try {
req = new ActiveXObject('Microsoft.XMLHTTP');
} catch (e){}
}
}
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send(null);
reqTimeout = setTimeout("req.abort();", 5000);
} else {
alert(" AJAX");
}
}
function processReqChange() {
document.form1.state.value = stat(req.readyState);
if (req.readyState == 4) {
clearTimeout(reqTimeout);
document.form1.statusnum.value = req.status;
document.form1.status.value = req.statusText;
// only if "OK"
if (req.status == 200) {
document.form1.response.value=req.responseText;
} else {
alert(" :\n" + req.statusText);
}
}
}
function stat(n)
{
switch (n) {
case 0:
return " ";
break;
case 1:
return "...";
break;
case 2:
return "";
break;
case 3:
|
|
|
return " ...";
break;
case 4:
return "";
break;
default:
return " ";
}
}
function requestdata(params)
{
loadXMLDoc('examples/httpreq.php?'+params);
}
HTML-:
<form name=form1>
<table width=100% style="font-size: 100%">
<tr>
<td width=30% valign=top> </td>
<td width=70%><input size=25 disabled type=text name=state value=""></td>
</tr>
<tr>
<td valign=top> </td>
<td><input disabled size=2 type=text name=statusnum value="">
<input disabled size=19 type=text name=status value=""></td>
</tr>
<tr>
<td valign=top> </td>
<td><textarea rows=6 name=response></textarea></td>
</tr>
<tr>
<td> GET-<td>
<td></td>
</tr>
</table>
<input type=text name=getparams value="?">
<input type=button onclick="requestdata(getparams.value);" value="GET">
</form>
PHP-:
<?php
header("Content-type: text/plain; charset=windows-1251");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
echo "Hello world!\n\n";
if (isset($a))
{
for ($i=1; $i < 10000; $i++)
{
echo ' . ';
if (($i % 1000) == 0) flush();
}
}
if (count($_GET) > 0)
{
echo "\n\n GET'\n"; print_r($_GET);
}
?>
DOM
, . DOM. responseText , . responseXML, DOM . , , replaceChild(), , responseXML XMLHttpRequest. .
, Ajax-. , , , HTML XML.
, . ? . , XMLHttpRequest . , onreadystatechange, request XMLHttpRequest.
if (request.readyState == 4){// 4(complete)
if (request.status == 200){
// HTTP OK, Ajax
//...
}else{
// - ,
error("HTTP " + request.status +
". : " + request.statusText);
}
}
, Ajax . XML . ,
, . Ajax .
<form action="traditional_action.php" method="post"
onsubmit="perform_ajax_action(); return false;">
, Ajax, onsubmit .
XMLHttpRequest. return false onsubmit, Ajax , , Ajax . , createAjaxRequest XMLHttpRequest.
|
|
|
var request; // our request object
function perform_ajax_action(){
if (!request = createAjaxRequest()){
// Ajax ,
//
return true;
}
// Ajax
//...
return false; //
}
, .
<form action="traditional_action.php" method="post"
onsubmit="return perform_ajax_action();">
, Ajax, . Ajax, , .
:
// - JavaScript:
var req = new ActiveXObject("Microsoft.XMLHTTP"); //( IE)
var req = new XMLHttpRequest(); // ( )
req
// ,
var req;
function loadXMLDoc(url) {
// branch for native XMLHttpRequest object
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
req.onreadystatechange = processReqChange;
req.open("GET", url, true);
req.send(null); }
// branch for IE/Windows ActiveX version
else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
if (req) {
req.onreadystatechange = processReqChange;
req.open("GET", url, true); //
req.send();//
}
}
}
// HTML :
function checkName(input, response)
{
if (response!= ''){
// Response mode
message = document.getElementById('nameCheckFailed');
if (response == '1'){
message.className = 'error';
}else{
message.className = 'hidden';
}
}else{
// Input mode
url = 'http://localhost/xml/checkUserName.php?q=' \\
+ input;
loadXMLDoc(url);
}
}
localhost/xml/checkUserName.php , q. XML , . , .
FormData
One of the enhancements to XMLHttpRequest is the introduction of the FormData object. With the FormData object, you can create and send a set of key/value pairs and, optionally, files using XMLHttpRequest. When using this technique, the data is sent in the same format as if you'd submitted it via the form's submit() method with the encoding type of multipart/form-data.
FormData HTML , JavaScript, , XMLHttpRequest.send(). :
var formData = new FormData();formData.append("part_num", "123ABC"); formData.append("part_price", 7.95);formData.append("part_image", somefile) var xhr = new XMLHttpRequest();xhr.open("POST", "http://some.url/"); xhr.send(formData);You can also use FormData to add additional data to an existing form before submitting it.
var formElement = document.getElementById("someFormElement");var formData = new FormData(formElement);formData.append("part_description", "The best part ever!"); var xhr = new XMLHttpRequest();xhr.open("POST", "http://some.url/");xhr.send(formData);
Cookies
Cookie HTTP . , , . "" .
cookie, HTTP . : cookie, HTTP_COOKIE .
: , , , cookie . cookie ( cookie), ( cookie ).
Cookie - , . HTTP . cookie , . , , . 'cookies.txt' .
cookies , . cookies . , WWW cookies login password , , .
cookies - .
, , - cookie . . Cookie , , .
cookie
, cookie , , cookie.
, cookie HTTP . Set-Cookie HTTP :
Set-Cookie: NAME=VALUE; expires=DATE; path=PATH; domain=DOMAIN_NAME; secure
Set-Cookie HTTP : Set-Cookie: NAME=VALUE;
NAME=VALUE - , , . NAME- cookie, VALUE - . , .
expires=DATE - cookie, .. DATE "expires=Monday, DD-Mon-YYYY HH:MM:SS GMT", cookie. , cookie , .
domain=DOMAIN_NAME - , cookie . , "domain=cit-forum.com". cookie cit-forum.com, www.cit-forum.com. , "COM", "EDU", "NET", "ORG", "GOV", "MIL" "INT". ("FIRM", "SHOP", "WEB", "ARTS", "REC", "INFO", "NOM"), , . "RU", , .
, , cookie.
path=PATH - , cookie. , "path=/win" , cookie /win/, /wings/ wind.html windows.shtml. , cookie , , , "path=/".
, cookie , , cookie.
secure - , cookie HTTPS (HTTP SSL - Secure Socket Level), . , .
HTTP Cookie
HTTP , cookie . , cookie, /:
Cookie: NAME1=OPAQUE_STRING1; NAME2=OPAQUE_STRING2...
cookie.
, cookie cookie NAME, domain path, . cookie .
expires cookie , () - - .
() cookies:
300 cookies
cookie 4
20 cookie
300 20 , . 4 cookie - ( ) .
, , proxy-, Set-cookie HTTP .
proxy- , Set-cookie , , 304 (Not Modified) 200 (OK). , Cookie, , If-modified-since.
, cookies
1. , cookie,
:
Set-Cookie: CUSTOMER=WILE_E_COYOTE; path=/; expires=Wednesday, 09-Nov-99 23:12:40 GMT
URL "/" , : Cookie: CUSTOMER=WILE_E_COYOTE
: Set-Cookie: PART_NUMBER=ROCKET_LAUNCHER_0001; path=/
URL "/" , cookie: Cookie: CUSTOMER=WILE_E_COYOTE; PART_NUMBER=ROCKET_LAUNCHER_0001
cookie, : Set-Cookie: SHIPPING=FEDEX; path=/foo
, URL "/" , cookie: Cookie: CUSTOMER=WILE_E_COYOTE; PART_NUMBER=ROCKET_LAUNCHER_0001
"/foo" cookie: Cookie: CUSTOMER=WILE_E_COYOTE; PART_NUMBER=ROCKET_LAUNCHER_0001; SHIPPING=FEDEX
: 'cookies.txt' cookie:
CUSTOMER=WILE_E_COYOTE
- 9 1999 . .
2. cookie ,
:
Set-Cookie: PART_NUMBER=ROCKET_LAUNCHER_0001; path=/
URL "/" , : Cookie: PART_NUMBER=ROCKET_LAUNCHER_0001
, , cookie : Set-Cookie: PART_NUMBER=RIDING_ROCKET_0023; path=/ammo
URL "/ammo" , : Cookie: PART_NUMBER=RIDING_ROCKET_0023; PART_NUMBER=ROCKET_LAUNCHER_0001
: / "PART_NUMBER". , expires.
cookie
cookie , . cookie URL (Universal Resource Locator), . , - META- HTML, JavaScript CGI-. , . - cookie, domain, (alias).
1. cookie META-
cookie - META- <HEAD>...</HEAD> HTML . :
<META HTTP-EQUIV="Set-Cookie" CONTENT="NAME=value; EXPIRES=date; DOMAIN=domain_name; PATH=path; SECURE">
cookie, , , CGI-. SSI (Server Side Include) PHP/Fi, CGI-. SSI cookie .
<META HTTP-EQUIV="Set-Cookie" CONTENT="..."> cookie , <!--#echo var="..."--> , cookie ( HTTP_COOKIE), <!--#if expr="..." -->, <!--#elif expr="..." --> <!--#else --> . , PHP/Fi.
SSI, PHP/Fi , cookie, JavaScript.
2. cookie JavaScript
cookie, JavaScript. , . JavaScript, "". , -, JavaScript cookie, http://www.citforum.ru/internet/javascript/exorg.shtml
3. cookie
// name - cookie
// value - cookie
// [expires] - cookie ( - )
// [path] - , cookie ( - , )
// [domain] - , cookie ( - , )
// [secure] - , cookie
function setCookie(name, value, expires, path, domain, secure) {
var curCookie = name + "=" + escape(value) +
((expires)? "; expires=" + expires.toGMTString(): "") +
((path)? "; path=" + path: "") +
((domain)? "; domain=" + domain: "") +
((secure)? "; secure": "")
if (!caution || (name + "=" + escape(value)).length <= 4000)
document.cookie = curCookie
else
if (confirm("Cookie 4KB !"))
document.cookie = curCookie
}
4. cookie
, cookie .
// name - cookie
function getCookie(name) {
var prefix = name + "="
var cookieStartIndex = document.cookie.indexOf(prefix)
if (cookieStartIndex == -1)
return null
var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length)
if (cookieEndIndex == -1)
cookieEndIndex = document.cookie.length
return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex))
}
5. cookie
, cookie expires, 1 1970 .
// name - cookie
// [path] - , cookie
// [domain] - , cookie
function deleteCookie(name, path, domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path)? "; path=" + path: "") +
((domain)? "; domain=" + domain: "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT"
}
, JavaScript cookie.
3. cookie CGI-
cookie - CGI-. cookie Perl :
print "Content-type: text/html\n";
print "Set-Cookie: username=aaa13; expires=Friday, 31-Dec-99 23:59:59 GMT; path=/; domain=www.citforum.ru;\n\n";
HTTP : Content-type: text/html
Set-Cookie: "username=aaa13; expires=Friday, 31-Dec-99 23:59:59 GMT; path=/; domain=www.citforum.ru;"
cookie, HTTP_COOKIE.
$cookie = $ENV{'HTTP_COOKIE'};
, , .
, cookie
, () . , cookie . , cookie . , cookie, Cookie Managers.
, , . . , , , ., .
<script type="text/javascript">
// :
var username = GetCookie('username');
if (username == null) {
username = prompt(' , \\n ( cancel)',"");
if (username == null) {
alert(' , Ѹ');
username = 'Ѹ';
} else {
pathname = location.pathname;
myDomain = pathname.substring(0,pathname.lastIndexOf('/')) +'/';
// expire .
var largeExpDate = new Date ();
largeExpDate.setTime(largeExpDate.getTime() + (365 * 24 * 3600 * 1000));
SetCookie('username',username,largeExpDate,myDomain);
}
}
function getCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function GetCookie (name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}
function SetCookie (name, value) {
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2)? argv[2]: null;
var path = (argc > 3)? argv[3]: null;
var domain = (argc > 4)? argv[4]: null;
var secure = (argc > 5)? argv[5]: false;
document.cookie = name + "=" + escape (value) +
((expires == null)? "": ("; expires=" +
expires.toGMTString())) +
((path == null)? "": ("; path=" + path)) +
((domain == null)? "": ("; domain=" + domain)) +
((secure == true)? "; secure": "");
}
document.write('<p align=center>, ' + username + '</p>');
</script>
<SCRIPT LANGUAGE="JavaScript">
// Alex Alexandrov wrote:
// This scrpt was taken from a book called "Learn Advanced Java Script" Chapter 14.
// The guys who wrote that book wanted us to leave a copyright. So here it goes:
// THIS SCRPIT IS COPYRIGHTED//
// Be AWARE TO PUT IT ON YOUR PAGE//
// Boolean variable specified if alert should be displayed if cookie exceeds 4KB
var caution = false
// name - name of the cookie
// value - value of the cookie
// [expires] - expiration date of the cookie (defaults to end of current session)
// [path] - path for which the cookie is valid (defaults to path of calling document)
// [domain] - domain for which the cookie is valid (defaults to domain of calling document)
// [secure] - Boolean value indicating if the cookie transmission requires a secure transmission
// * an argument defaults when it is assigned null as a placeholder
// * a null placeholder is not required for trailing omitted arguments
function setCookie(name, value, expires, path, domain, secure) {
var curCookie = name + "=" + escape(value) +
((expires)? "; expires=" + expires.toGMTString(): "") +
((path)? "; path=" + path: "") +
((domain)? "; domain=" + domain: "") +
((secure)? "; secure": "")
if (!caution || (name + "=" + escape(value)).length <= 4000)
document.cookie = curCookie
else
if (confirm("Cookie 4KB !"))
document.cookie = curCookie
}
// name - name of the desired cookie
// * return string containing value of specified cookie or null if cookie does not exist
function getCookie(name) {
var prefix = name + "="
var cookieStartIndex = document.cookie.indexOf(prefix)
if (cookieStartIndex == -1)
return null
var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length)
if (cookieEndIndex == -1)
cookieEndIndex = document.cookie.length
return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex))
}
// name - name of the cookie
// [path] - path of the cookie (must be same as path used to create cookie)
// [domain] - domain of the cookie (must be same as domain used to create cookie)
// * path and domain default if assigned null or omitted if no explicit argument proceeds
function deleteCookie(name, path, domain) {
if (getCookie(name)) {
document.cookie = name + "=" +
((path)? "; path=" + path: "") +
((domain)? "; domain=" + domain: "") +
"; expires=Thu, 01-Jan-70 00:00:01 GMT"
}
}
function fixDate(date) {
var base = new Date(0)
var skew = base.getTime()
if (skew > 0)
date.setTime(date.getTime() - skew)
}
function initCookie(monthName) {
// initializes cookie with the following format:
// ^1^^2^^3^^4^...^30^^31^
// initialize accumulative variable
var text = ""
for (var i = 1; i <= 31; ++i) {
text += "^" + i + "^"
}
var now = new Date()
fixDate(now)
// set time to one month (31 days) in the future
now.setTime(now.getTime() + 1000 * 60 * 60 * 24 * 31)
setCookie(monthName + "Calendar", text, now)
}
function getSpecificReminder(num, monthName) {
var prefix = "^" + num + "^"
var totalCookie = getCookie(monthName + "Calendar")
var startIndex = totalCookie.indexOf(prefix, 0)
var startData = totalCookie.indexOf("^", startIndex + 1) + 1
if (num == 31)
var endData = totalCookie.length
else
var endData = totalCookie.indexOf("^", startData)
return totalCookie.substring(startData, endData)
}
function setSpecificReminder(num, monthName, newValue) {
var prefix = "^" + num + "^"
var totalCookie = getCookie(monthName + "Calendar")
var startIndex = totalCookie.indexOf(prefix, 0)
var startData = totalCookie.indexOf("^", startIndex + 1) + 1
if (num == 31)
var endData = totalCookie.length
else
var endData = totalCookie.indexOf("^", startData)
var now = new Date()
fixDate(now)
// set time to one month (31 days) in the future
now.setTime(now.getTime() + 1000 * 60 * 60 * 24 * 31)
setCookie(monthName + "Calendar", totalCookie.substring(0, startData) + newValue + totalCookie.substring(endData, totalCookie.length), now)
}
function getInput(num, monthName) {
if (!getCookie(monthName + "Calendar"))
initCookie(monthName)
var newValue = prompt(" :", getSpecificReminder(num, monthName))
if (newValue) // user did not cancel
setSpecificReminder(num, monthName, newValue)
}
function getTime() {
// initialize time-related variables with current time settings
var now = new Date()
var hour = now.getHours()
var minute = now.getMinutes()
now = null
var ampm = ""
// validate hour values and set value of ampm
if (hour >= 12) {
hour -= 12
ampm = "PM"
} else
ampm = "AM"
hour = (hour == 0)? 12: hour
// add zero digit to a one digit minute
if (minute < 10)
minute = "0" + minute // do not parse this number!
// return time string
return hour + ":" + minute + " " + ampm
}
function leapYear(year) {
if (year % 4 == 0) // basic rule
return true // is leap year
return false // is not leap year
}
function getDays(month, year) {
// create array to hold number of days in each month
var ar = new Array(12)
ar[0] = 31 // January
ar[1] = (leapYear(year))? 29: 28 // February
ar[2] = 31 // March
ar[3] = 30 // April
ar[4] = 31 // May
ar[5] = 30 // June
ar[6] = 31 // July
ar[7] = 31 // August
ar[8] = 30 // September
ar[9] = 31 // October
ar[10] = 30 // November
ar[11] = 31 // December
// return number of days in the specified month (parameter)
return ar[month]
}
function getMonthName(month) {
// create array to hold name of each month
var ar=["", "", "", "", "","", "", "", ""
, "", "",""];
/*var ar = new Array(12)
ar[0] = ""
ar[1] = ""
ar[2] = ""
ar[3] = ""
ar[4] = ""
ar[5] = ""
ar[6] = ""
ar[7] = ""
ar[8] = ""
ar[9] = ""
ar[10] = ""
ar[11] = ""*/
// return name of specified month (parameter)
return ar[month]
}
function setCal() {
// standard time attributes
var now = new Date()
var year = now.getYear()
var month = now.getMonth()
var monthName = getMonthName(month)
var date = now.getDate()
now = null
// create instance of first day of month, and extract the day on which it occurs
var firstDayInstance = new Date(year, month, 1)
var firstDay = firstDayInstance.getDay()
firstDayInstance = null
// number of days in current month
var days = getDays(month, year)
// call function to draw calendar
drawCal(firstDay + 1, days, date, monthName, 1900 + year)
}
function drawCal(firstDay, lastDate, date, monthName, year) {
// constant table settings
var headerHeight = 35 // height of the table's header cell
var border = 0 // 3D height of table's border
var cellspacing = 0 // width of table's border
var headerColor = "00008b" // color of table's header
var headerSize = "+2" // size of tables header font
var colWidth = 45 // width of columns in table
var dayCellHeight = 15 // height of cells containing days of the week
var dayColor = "000000" // color of font representing week days
var cellHeight = 25 // height of cells representing dates in the calendar
var todayColor = "red" // color specifying today's date in the calendar
var timeColor = "purple" // color of font representing current time
var dayCellcolor="87ceda"
var monthColor="6485ed"
// create basic table structure
var text = "" // initialize accumulative variable to empty string
text += '<CENTER>'
text += '<TABLE BORDER=' + border + ' CELLSPACING=' + cellspacing + '>' // table settings
text += '<TH COLSPAN=7 HEIGHT=' + headerHeight + ' BGCOLOR='+ monthColor +'>' // create table header cell
text += '<FONT COLOR="' + headerColor + '" SIZE=' + headerSize + '>' // set font for table header
text += monthName + ' ' + year
text += '</FONT>' // close table header's font settings
text += '</TH>' // close header cell
// variables to hold constant settings
var openCol = '<TD align=right WIDTH=' + colWidth + ' HEIGHT=' + dayCellHeight + ' BGCOLOR='+ dayCellcolor +'>'
openCol += '<FONT SIZE=-1 COLOR="' + dayColor + '">'
var closeCol = '</FONT></TD>'
// create array of abbreviated day names
var weekDay = new Array(7)
weekDay[0] = ""
weekDay[1] = ""
weekDay[2] = ""
weekDay[3] = ""
weekDay[4] = ""
weekDay[5] = ""
weekDay[6] = ""
//create first row to set column width and specify week day
text += '<TR ALIGN="center" VALIGN="center">'
for (var dayNum = 0; dayNum < 7; ++dayNum) {
text += openCol + weekDay[dayNum] + closeCol
}
text += '</TR>'
//declaration of two variables to help with tables
var digit = 1
var curCell = 1
for (var row = 1; row <= Math.ceil((lastDate + firstDay - 1) / 7); ++row) {
text += '<TR ALIGN="right" VALIGN="top">'
for (var col = 1; col <= 7; ++col) {
if (digit > lastDate)
break
if (curCell < firstDay) {
text += '<TD></TD>';
curCell++
} else {
if (digit == date) {
// current cell repesent today's date
text += '<TD HEIGHT=' + cellHeight + ' BGCOLOR="#00FFFF">'
text += '<FONT COLOR="' + todayColor + '">'
text += '<A HREF="javascript:getInput(' + digit + ', \'' + monthName + '\')" onMouseOver="window.status = \' ' + monthName + ' ' + digit + '\'; return true"><FONT SIZE=-1 COLOR="' + todayColor + '">' + digit + '</FONT></A>'
text += '<BR>'
text += '<FONT COLOR="' + timeColor + '" SIZE=2>'
text += '<CENTER>' + getTime() + '</CENTER>'
text += '</FONT>'
text += '</TD>'
} else
text += '<TD HEIGHT=' + cellHeight + ' BGCOLOR= "#C0C0C0"><FONT SIZE=-1><A HREF="javascript:getInput(' + digit + ', \'' + monthName + '\')" onMouseOver="window.status = \' ' + monthName + ' ' + digit + '\'; return true">' + digit + '</A></FONT></TD>'
digit++
}
}
text += '</TR>'
}
// close all basic table tags
text += '</TABLE>'
text += '</CENTER>'
// print accumulative HTML string
document.write(text)
}
setCal()
</script>
JavaScript
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script language="JavaScript">
day = new Date();
hour = day.getHours();
if (hour>=5 && hour<12) greeting = " ";
else
if (hour>=12 && hour<18) greeting = " ";
else
if (hour>=18 && hour<24) greeting = " ";
else
if (hour>=0 && hour<5) greeting = " ";
document.write(greeting); </script>
</head>
<body>
</body>
</html>
<!-- 32: -->
<html><head>
<style>
.menuContainer {
border: 1px solid #123456;
}
.menuContainer.menuItem {
float: left;
margin: 2px;
padding: 10px;
}
.menuContainer.menuOver {
background-color: #808080;
}
.menuContainer.menuOver a {
color: #800000;
font-weight: bold;
}
.menuContainer.clear {
clear: left;
}
</style>
<script type="text/javascript">
function processMenu() {
var allDiv = document.getElementsByTagName("DIV");
for (var i = 0; i < allDiv.length; i++) {
if (allDiv[i].className == "menuContainer")
processMenuItem(allDiv[i]);
}
}
function processMenuItem(_obj) {
var allChilds = _obj.childNodes;
for (var i = 0; i < allChilds.length; i++) {
if (allChilds[i].className == "menuItem") {
allChilds[i].onmouseover = function() {
this.className += " menuOver";
}
allChilds[i].onmouseout = function() {
this.className =
this.className.replace(" menuOver","");
}
}
}
}
</script>
</head>
<body onload="processMenu();">
<div class="menuContainer">
<div class="menuItem"><a href="#">first</a></div>
<div class="menuItem"><a href="#">second</a></div>
<div class="menuItem"><a href="#">third</a></div>
<div class="menuItem"><a href="#">fourth</a></div>
<div class="clear"></div>
</div>
</body></html>
<!-- pr33: -->
<script type="text/javascript">
function submitForm(_form) {debugger;
markErrorField(false);
var errMess = "";
if (!_form.elements["login"].value) {
errMess += "Your Login is empty.\n";
markErrorField(_form.elements["login"]);
}
if (!_form.elements["mail"].value) {
errMess += "Your Email is empty\n";
markErrorField(_form.elements["mail"]);
}
if (!_form.elements["pass"].value) {
errMess += "Your Password is empty.\n";
markErrorField(_form.elements["pass"]);
} else if (!_form.elements["confpass"].value) {
errMess +=
"Your Password confirmation is empty.\n";
markErrorField(_form.elements["confpass"]);
} else if
(_form.elements["pass"].value!=
_form.elements["confpass"].value) {
errMess +=
"Your Password confirmation does not equal to your Password.\n";
markErrorField(_form.elements["pass"]);
markErrorField(_form.elements["confpass"]);
}
if (errMess) {
alert(errMess + "");
return false;
}
}
function markErrorField(_element) {
var allLabels =
document.getElementsByTagName("LABEL");
if (_element) {
for (var i = 0; i < allLabels.length; i++) {
if (allLabels[i].htmlFor == _element.id)
allLabels[i].style.color = "red"; }
} else {
for (var i = 0; i < allLabels.length; i++) {
allLabels[i].style.color = "black";
}
}
}
</script>
<form onsubmit="return submitForm(this);">
<table>
<tr>
<td><label for="login">Your Login</label></td>
<td><input type="text" name="login" id="login" /></td>
</tr>
<tr>
<td><label for="mail">Your Email</label></td>
<td><input type="text" name="mail" id="mail" /></td>
</tr>
<tr>
<td><label for="pass">Your Password</label></td>
<td><input type="password" name="pass" id="pass" /></td>
</tr>
<tr>
<td><label for="confpass">
Confirm Your Password</label></td>
<td><input type="password" name="confpass"
id="confpass" /></td>
</tr>
<tr>
<td colspan="2"><input type="submit"
name="Register" /></td>
</tr>
</table>
</form>
//pr34- (checkbox)
<html>
<head>
<script type="text/javascript">
function checkAll(oForm, cbName, checked)
{
for (var i=0; i < oForm[cbName].length; i++) oForm[cbName][i].checked = checked;
}
</script>
</head>
<body>
<form name="form1" method="post" action="">
<input type="checkbox" name="total" value="checkbox" onClick="checkAll(this.form,'checkbox[]',this.checked)">
<br>
<input type="checkbox" name="checkbox[]" value="checkbox">1
<br>
<input type="checkbox" name="checkbox[]" value="checkbox">2
<br>
<input type="checkbox" name="checkbox[]" value="checkbox">3
</form>
</body>
</html>
//pr35- ,
<html>&l
