function Test1() {
Alert(' aaassssssssssssssssssssss ' }
<body onmousedown= "test1()" style= "border:solid 1px red; width:200px; height:200px; " >
With parameter function test1(e) { window.alert(' x= ' +e.clientx+ ' y= ' + E.clienty);}
<body onmousedown= "test1(event)" style= "border:solid 1px red; width:200px; height:200px; " >
<script language= "JavaScript" >
Event-driven
function Data1 () {
var d=new Date ()
document.write (d.totimestring ())
}
</script>
<body>
<input type= "button" value= "click" onclick= "Data1 ()" >
Import external CSS
Do not import external CSS
<script language= "JavaScript";
//Event-driven
function data1 () {
var d=new Date () document.write (d.totimestring ())
}
Function hs (obj) {
if (obj.value== ' black ') {
Get ID
var abc=document.getelementbyid (' abc ')
abc.style.backgroundcolor= ' Black '}
else{
var abc=document.getelementbyid (' abc ')
Abc.style.backgroundColor = ' Red '}
}
</script>
<body>
<input type= "button" value= "click" onclick= "Data1 ()";
& L T;div id= ' abc ' style= "width:400px;height:400px;" >div1</div>
<input type= "button" value= "Black" onclick= "HS (This)"/>
<input type= "button" value = "Red" onclick= "HS (This)"/>
Import external CSS
CSS external files
. s1{
width:500px;
height:500px;
Background-color: #34538b;
}
HTML file
<script language= "JavaScript" >
Get all the selectors from all the external CSS
function HS (obj) {
The Var set1=document.stylesheets[0].rules;//rules is under IE
Remove the desired style from the Set1
var set2=set1[0]
Set1[0] Here O represents the first rule in a CSS file
if (obj.value== ' black ') {
Set2.style.backgroundcolor= ' black ';
}else if (obj.value== ' red ') {
Set2.style.backgroundcolor= ' Red ';
}
}
</script>
<body>
<div id= ' abc ' class= "S1" >div1</div>
<input type= "button" value= "Black" onclick= "HS (This)"/>
<input type= "button" value= "Red" onclick= "HS (This)"/>
How to understand event-driven mechanisms compatible with different browsers
XMLHttpRequest Object
if (window. XMLHttpRequest) {//Firefox, Google, ie
if (!window. ActiveXObject) {//Firefox, Safari;
Alert (' Firefox ')
}else
{
Alert (' IE ')
}
}
else{
Alert (' IE6 ')
}
An event can be monitored by multiple functions
<script language= "JavaScript" >
function HS (o) {
Alert (' OK ')
}
function text (O1) {
Alert (' Ok1 ')
}
</script>
<body>
<input type= "button" value= "Black" onclick= "HS (this), the text (this)"/><!--button functions in the order of execution--
Windows has 3 windows open and close events
OnLoad: Page Open
onBeforeUnload: Before the page closes
OnUnload: After the page is closed
Mouse events:
Oncontextmenu=false Right-click to see menu
function aa () {
Alert (' No ')
return False}
oncontextmenu= ' return AA () '
Onselectstart when working with a mouse on a page (such as copying, etc.)
JavaScript (JS) Basics: Event-driven mechanism