js中事件的处理与浏览器对象示例介绍


Posted in Javascript onNovember 29, 2013
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
<head> 
<title>简单的事件处理</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!-- 
<script language="text/javascript" src="hello.html">这个js的外部调用标签不能自结束</script> 
<link rel="stylesheet" type="text/css" href="./styles.css"> 
--> 
<script type="text/javascript"> 
function clickD(obj){ 
alert(obj.innerHTML); 
} 
function mouseD(obj){ 
obj.style.color = "#f00"; 
//当使用代码来设置样式时,如果css中通过-来表示的,都必须要用驼峰标示font-size -> fontSize 
obj.style.fontSize = "16px"; 
} 
function outD(obj){ 
obj.style.color = "#000"; 
obj.style.fontSize = "18px"; 
} 
//with的用法 
with(document){ 
write("dddd<br/>"); 
} 
document.write("aaaa<br/>"); 
document.write("bbbb<br/>"); 
document.write("cccc<br/>"); 
</script> 
</head> 
<body> 
<div onclick="clickD(this)" style="cursor:pointer;">点击了试一下</div> 
<div onmouseover="mouseD(this)" onmouseout="outD(this)">鼠标移动来试试</div> 
</body> 
</html>

2,浏览器对象的例子:《涉及的是两个浏览器页面之间的传值》
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>js01_hello</title> 
<meta name="author" content="Administrator" /> 
<script type="text/javascript"> 
// setTimeout("endWelcome()",5000); 
// function endWelcome() { 
// document.getElementById("welcome").style.display = "none"; 
// } 
</script> 
</head> 
<body> 
<div id="welcome">欢迎进行我们的网站</div> 
<a href="#" onclick="window.open('test02.html','aaa','width=300,height=300,resizable=0')">test02</a> 
<a href="#" onclick="window.open('test03.html','aaa','width=400,height=400,resizable=0')">test03</a> 
<br/> 
<a href="#" onclick="window.open('bless.html','aaa','width=600,height=300')">输入你祝福语</a> 
<a href="#" onclick="window.open('bless.html','aaa','width=600,height=300')">选择性别</a> 
<div id="bless"></div> 
</body> 
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 
"http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>js01_hello</title> 
<meta name="author" content="Administrator" /> 
<script type="text/javascript"> 
function bless() { 
//获取输入的祝福语 
var mb = document.getElementById("mb").value; 
//获取父类窗口 
var p = window.opener; 
//获取父类窗口中的id为bless的div 
var pd = p.document.getElementById("bless"); 
//设置pd的值 
pd.innerHTML = mb; 
//关闭当前窗口 
window.close(); 
} 
</script> 
</head> 
<body> 
输入祝福语:<input type="text" size="40" id="mb"/><input type="button" onclick="bless()" value="输入" /> 
</body> 
</html>
Javascript 相关文章推荐
jquery 的 $(&quot;#id&quot;).html() 无内容的解决方法
Jun 07 Javascript
一个JQuery写的点击上下滚动的小例子
Aug 27 Javascript
js中scrollHeight,scrollWidth,scrollLeft,scrolltop等差别介绍
May 16 Javascript
导入extjs、jquery 文件时$使用冲突问题解决方法
Jan 14 Javascript
使用Sticker.js实现贴纸效果
Jan 28 Javascript
JavaScript学习笔记之数组随机排序
Mar 23 Javascript
基于百度地图实现产品销售的单位位置查看功能设计与实现
Oct 21 Javascript
使用jQuery实现简单的tab框实例
Aug 22 jQuery
关于Vue背景图打包之后访问路径错误问题的解决
Nov 03 Javascript
在Vue项目中引入腾讯验证码服务的教程
Apr 03 Javascript
Vue中使用Sortable的示例代码
Apr 07 Javascript
ES6小技巧之代替lodash
Jun 07 Javascript
js实现的折叠导航示例
Nov 29 #Javascript
javascript特殊用法示例介绍
Nov 29 #Javascript
jquery和ajax的关系详细介绍
Nov 29 #Javascript
js操作table示例(个人心得)
Nov 29 #Javascript
css配合jquery美化 select
Nov 29 #Javascript
Jjcarousellite 实现图片列表滚动的简单实例
Nov 29 #Javascript
JS实现多物体缓冲运动实例代码
Nov 29 #Javascript
You might like
破除一些网站复制、右键限制
2006/11/04 Javascript
通过AJAX的JS、JQuery两种方式解析XML示例介绍
2013/09/23 Javascript
Jquery插件编写简明教程
2014/03/25 Javascript
js实现仿Windows风格选项卡和按钮效果实例
2015/05/13 Javascript
png在IE6 下无法透明的解决方法汇总
2015/05/21 Javascript
使用DNode实现php和nodejs之间通信的简单实例
2015/07/06 NodeJs
实现JavaScript的组成----BOM和DOM详解
2016/05/18 Javascript
几种二级联动案例(jQuery\Array\Ajax php)
2016/08/13 Javascript
常用原生js自定义函数总结
2016/11/20 Javascript
基于代数方程库Algebra.js解二元一次方程功能示例
2017/06/09 Javascript
关于页面刷新vuex数据消失问题解决方案
2017/07/03 Javascript
Vue2.0 axios前后端登陆拦截器(实例讲解)
2017/10/27 Javascript
基于vue cli重构多页面脚手架过程详解
2018/01/23 Javascript
Vue实现点击时间获取时间段查询功能
2020/08/21 Javascript
vue项目部署上线遇到的问题及解决方法
2018/06/10 Javascript
vue中各种通信传值方式总结
2019/02/14 Javascript
在layui tab控件中载入外部html页面的方法
2019/09/04 Javascript
关于uniApp editor微信滑动问题
2021/01/15 Javascript
[02:50]2014DOTA2 TI预选赛预选赛 大神专访第一弹!
2014/05/21 DOTA
python使用BeautifulSoup分析网页信息的方法
2015/04/04 Python
详解python实现读取邮件数据并下载附件的实例
2017/08/03 Python
python+unittest+requests实现接口自动化的方法
2018/11/29 Python
pyqt5实现俄罗斯方块游戏
2019/01/11 Python
python 监听salt job状态,并任务数据推送到redis中的方法
2019/01/14 Python
python使用梯度下降算法实现一个多线性回归
2020/03/24 Python
python之语音识别speech模块
2020/09/09 Python
Django框架安装及项目创建过程解析
2020/09/14 Python
CSS3中Color的一些特性介绍
2012/05/27 HTML / CSS
CSS3实现苹果手机解锁的字体闪亮效果示例
2021/01/05 HTML / CSS
欧洲最大的球衣网上商店:Kitbag
2017/11/11 全球购物
Herve Leger官网:标志性绷带连衣裙等
2018/12/26 全球购物
广播节目策划方案
2014/05/23 职场文书
派出所副所长四风问题个人整改措施思想汇报
2014/10/13 职场文书
2015年人力资源部工作总结
2015/04/30 职场文书
2015秋季运动会通讯稿
2015/07/18 职场文书
2016学校先进集体事迹材料
2016/02/29 职场文书