JavaScript

超轻量级php框架startmvc

js弹出窗口简单实现代码

更新时间:2020-05-01 05:48:01 作者:startmvc
本文实例为大家分享了js弹出窗口展示的具体代码,供大家参考,具体内容如下<!DOCTYPEhtml

本文实例为大家分享了js弹出窗口展示的具体代码,供大家参考,具体内容如下


<!DOCTYPE html>
<html>
<head lang="en">
 <meta charset="UTF-8">
 <title></title>
 <style>
 body{
 /*margin: 0;*/
 }
 #div1{
 width: 100px;
 height: 100px;
 border: 1px solid red;
 }
 </style>
</head>
<body>
<div id="div1" onmouseover="getInfo(this)" onmouseout="this.innerHTML=''">

</div>
<button onclick="getInfo()">获取div信息</button>

<hr/>
<a href="111.html" rel="external nofollow" target="_blank">我是超链接</a>
<br/><br/>
<button onclick="myopen1()">新窗口111111111</button>
<button onclick="myopen2()">新窗口222222222</button>
<button onclick="myopen3()">新窗口333333333</button>

<hr/>
<button onclick="myclose()">关掉子窗口</button>

<script>
 var mywin;
 function myclose(){
 if(mywin)
 mywin.close();
 }
 function myopen3(){
 mywin = window.open('333.html', 'news', 'resizable=no');
 }
 function myopen2(){
 mywin = window.open('222.html', 'news', 'resizable=no');
 }
 function myopen1(){
 mywin = window.open('111.html', 'news', 'resizable=no');
 }
 function getInfo(obj){
// var div1 = document.getElementById('div1');

 obj.innerHTML = obj.offsetWidth+',,'+obj.offsetHeight;
 obj.innerHTML += '<br>'+obj.offsetLeft+',,'+obj.offsetTop;
 // offsetXXX 只能读取不能赋值修改
 obj.offsetWidth = obj.offsetWidth+100;
 // 下面的属性已经不能用了
// obj.innerHTML += '<br>'+obj.innerWidth+',,'+obj.innerHeight;
 }
</script>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

js 弹出窗口