Some of the most important and influential elements in HTML are <script> and <style>. They are HTML sections that allow the embedding of JavaScript and CSS inside one HTML file. This minimizes the number of files you need, as scripts can be included in one file. The <style> tag contains CSS code. It is usually positioned in the document's <head> section. The CSS code inside follows normal CSS rules; a # sign signals an element with a particular id, and a dot signals a class definition. The <style> tag can affect any element in the document and define class definitions for the document.
The <script> tag defines a section of JavaScript, which can call actions, set timers, or reroute the user on the fly. The <script> tag is also usually located in the <head>, and it can link to an external JavaScript file via the src attribute. Within the cript is often something like:
<script>
setInterval(function() {
//sets a function to repeat every n milliseconds.
if (<?php echo($status); ?> = 1) {
//Is the PHP status variable equal to 1? If so...
if (confirm("You have a status of 1. Do you wish to proceed?")) {
//Summons a confirmation box. If 'yes' is selected...
location.assign("statusOf1.php");
//...send the user here.
}
}
}, 5000)
//5000 means 5000 milliseconds, or 5 seconds.
</script>
The <script> tag is a powerful tool, as it embeds JavaScript into a file. The script can do anything at all when combined with PHP.
Interactive attributes detect when a certin action happens on an element, and define a response for when that happens, usually a function call. These attributes spare one the trouble of adding a complex event listener via manual JavaScript. The value of such an attribute is a block of JavaScript. Often, this is a call to a function defined in a <script> tag:
<script>
function callMe() {
alert("Ouch!");
}
</script>
===============================================
<p onClick="callMe();">Click Me!!</p>
This outputs:
The other interactive attributes include:
onMouseOver=""
onHover=""
onDblClick=""
onKeyUp=""
onKeyPress=""
onMouseUp=""
onMouseDown=""
onMouseOut=""
Well, that's all for now!
Next, I will begin the discussion of user input, in preparation for handling a form.
__RESOURCES__
http://www.minecaptain.com —My Website
An iframe —My Website in an iframe
A Blank HTML File —Experiment!
Comments