吴裕雄--天生自然 JAVASCRIPT开发学习: DOM 事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <h1 onclick="this.innerHTML='Ooops!'">点击文本!</h1> </body>
</html>


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function changetext(id){
id.innerHTML="Ooops!";
}
</script>
</head>
<body> <h1 onclick="changetext(this)">点击文本!</h1> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <p>点击按钮执行 <em>displayDate()</em> 函数.</p>
<button onclick="displayDate()">点这里</button>
<script>
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
</head>
<body> <p>点击按钮执行 <em>displayDate()</em> 函数.</p>
<button id="myBtn">点这里</button>
<script>
document.getElementById("myBtn").onclick=function(){displayDate()};
function displayDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body onload="checkCookies()"> <script>
function checkCookies(){
if (navigator.cookieEnabled==true){
alert("Cookies 可用")
}
else{
alert("Cookies 不可用")
}
}
</script>
<p>弹窗-提示浏览器 cookie 是否可用。</p> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function myFunction(){
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
</script>
</head>
<body> 输入你的名字: <input type="text" id="fname" onchange="myFunction()">
<p>当你离开输入框后,函数将被触发,将小写字母转为大写字母。</p> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:#D94A38;width:120px;height:20px;padding:40px;">Mouse Over Me</div>
<script>
function mOver(obj){
obj.innerHTML="Thank You"
}
function mOut(obj){
obj.innerHTML="Mouse Over Me"
}
</script> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function lighton(){
document.getElementById('myimage').src="bulbon.gif";
}
function lightoff(){
document.getElementById('myimage').src="bulboff.gif";
}
</script>
</head> <body>
<img id="myimage" onmousedown="lighton()" onmouseup="lightoff()" src="bulboff.gif" width="100" height="180" />
<p>点击不释放鼠标灯将一直亮着!</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function mymessage(){
alert("消息在 onload 事件触发后弹出。");
}
</script>
</head> <body onload="mymessage()"></body> </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<head>
<script>
function myFunction(x){
x.style.background="yellow";
}
</script>
</head>
<body> 输入你的名字: <input type="text" onfocus="myFunction(this)">
<p>当输入框获取焦点时,修改背景色(background-color属性) 将被触发。</p> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <h1 onmouseover="style.color='red'"onmouseout="style.color='black'">将鼠标移至文部上</h1> </body>
</html>

吴裕雄--天生自然 JAVASCRIPT开发学习: DOM 事件的更多相关文章
- 吴裕雄--天生自然 JAVASCRIPT开发学习:事件
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:HTML DOM 节点列表
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:HTML DOM 集合(Collection)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: DOM
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:HTML DOM 元素 (节点)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:DOM EventListener
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: HTML DOM - 改变CSS
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: DOM - 改变 HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:对象 实例(2)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- 嵊州普及Day2T1
题意:对于给出的数列,有多少数可表示为另两数的和. 思路:先排个序,桶排思路.以一个数组储蓄所有出现的和.最后循环判断是否b[i]>0. 见代码: #include<iostream> ...
- vue-i18n多语言文件归类的两种方法
1.按语言类型归类 流行的做法是按照语言对文件进行归类,目录结构类似于: --lang ----en ------test.json --------"abc": "ab ...
- java集合简单特性
- 通过fiddler修改通讯返回值
1 在fiddler里选中url,右键unlock for editing 2 在fiddler里点击url, 在右面的返回值的 TextView 项里修改数据 3 取消 unlock for e ...
- dedecms调用当前栏目的子栏目及子栏目文章
{dede:channelartlist} <ul> {dede:arclist titlelen='60' row='8'} <img src=" ...
- TensorFlow--交互式使用--tf.InteractiveSession()
用tf.Session()创建会话时只有在会话中run某个张量才能得到这个张量的运算结果,而交互式环境下如命令行.IPython,想要执行一行就得到结果,这就需要用到tf.InteractiveSes ...
- 实验吧-杂项-啦啦啦(数据包http导出、图片拼接)
比较综合的一道题. 1.数据包数据提取 首先下载数据包,一般数据包都是抓取的一些数据,需要对数据进行分析. 用wireshark打开数据包,筛选出http协议的数据,发现有两个是上传的数据: 我们就看 ...
- 【pwnable.kr】coin1
pwnable从入门到放弃又一发 说是一道pwnable,其实是一道coding... nc pwnable.kr 9007 连接上看看,玩硬币? 老子是来拿flag的,谁来哄孩子来了!!! 算了,f ...
- 【LeetCode】解码方法
[问题] 一条包含字母 A-Z 的消息通过以下方式进行了编码:'A' -> 1'B' -> 2…'Z' -> 26给定一个只包含数字的非空字符串,请计算解码方法的总数. 示例 : 输 ...
- hostapd 热点设置
一. 需要安装的服务:hostapd dhcp(isc-dhcp-server) dns(dnsmasq或者bind9或者都不装设成8.8.8.8 ) 二.建hostapd.conf文件 ,su ...