JavaScript
<script>标签中不在需要type="text/javascript" <script src="myScript.js"></script>
JavaScript is the default scripting language in HTML5 and in all modern browsers!
JavaScript Data Types
String, Number, Boolean, Array, Object, Null, Undefined
"Everything" in JavaScript is an Object.
JavaScript Errors - Throw and Try to Catch
try {
var x=document.getElementById("demo").value;
if(x=="") throw "empty";
if(isNaN(x)) throw "not a number";
if(x>10) throw "too high";
if(x<5) throw "too low";
} catch(err) {
y.innerHTML="Error: " + err + ".";
}
Boolean Object
0, -0, null, "", false, undefined, NaN --- false
RegExp Object
test() method searches a string for a specified value, and returns true or false, depending on the result.
exec() method searches a string for a specified value, and returns the text of the found value. If no match is found, it returns null.
JavaScript HTML DOM
Finding HTML Elements
- Finding HTML elements by id
- Finding HTML elements by tag name
- Finding HTML elements by class name(does not work in Internet Explorer 5,6,7, and 8)
- Finding HTML elements by HTML object collections(document.forms["frm1"], anchors,images,links)]
Changing the HTML
changing the output stream: document.write(Date());
changing html content: document.getElementById(id).innerHTML=new HTML
changing the value of attribute: document.getElementById(id).attribute=new value
Changing HTML Style
document.getElementById(id).style.property=new style
The Browser Object Model
The Window Object
var w=window.innerWidth|| document.documentElement.clientWidth|| document.body.clientWidth;
var h=window.innerHeight|| document.documentElement.clientHeight|| document.body.clientHeight;
- window.open() - open a new window
- window.close() - close the current window
- window.moveTo() -move the current window
- window.resizeTo() -resize the current window
Window Screen
Window Location
- location.hostname returns the domain name of the web host
- location.pathname returns the path and filename of the current page
- location.port returns the port of the web host (80 or 443)
- location.protocol returns the web protocol used (http:// or https://)
- location.href returns the the URL of the current page.
- location.assign() method loads a new document.
Window History
- history.back() - same as clicking back in the browser
- history.forward() - same as clicking forward in the browser
Window Navigator
The information from the navigator object can often be misleading, and should not be used to detect browser version.
Since different browsers support different objects, you can use objects to detect browsers.
if (window.opera) {...some action...}
Popup Box
alert("sometext");
confirm("sometext");
prompt("sometext","defaultvalue");
JavaScript Timing Events
- setInterval("function",milliseconds) - executes a function, over and over again, at specified time intervals
- setTimeout("function",milliseconds) - executes a function, once, after waiting a specified number of milliseconds
- clearInterval(intervalVariable) - stop the execution
JavaScript Cookie
A cookie is a variable that is stored on the visitor's computer. Each time the same computer requests a page with a browser, it will send the cookie too. With JavaScript, you can both create and retrieve cookie values.
getCookie("username"); setCookie("username",username,365);
JavaScript Objects Reference
The references describe the properties and methods of each object, along with examples.
- Array object
- Boolean object
- Date object
- Math object
- Number object
- String object
- RegExp object
- Global properties and functions
Browser Objects Reference
The references describe the properties and methods of each object, along with examples.
HTML DOM Reference
The references describe the properties and methods of the HTML DOM, along with examples.
HTML Element Objects Reference
The references describe the properties and methods of each HTML object, along with examples.
- Anchor object
- Area object
- Base object
- Body object
- Button object
- Form object
- Frame/IFrame object
- Frameset object
- Image object
- Input Button object
- Input Checkbox object
- Input File object
- Input Hidden object
- Input Password object
- Input Radio object
- Input Reset object
- Input Submit object
- Input Text object
- Link object
- Meta object
- Object object
- Option object
- Select object
- Style object
- Table object
- td / th object
- tr object
- Textarea object