BOM中的open和close

最新推荐文章于 2023-02-14 06:26:27 发布

J·M

最新推荐文章于 2023-02-14 06:26:27 发布

阅读量283

点赞数

分类专栏：前端 js 文章标签： bom

本文链接：https://blog.csdn.net/JXXHA/article/details/109671264

版权

js 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

前端

3 篇文章 0 订阅

订阅专栏

这篇博客探讨了HTML中的`<ul>`和`<button>`元素与JavaScript的交互。作者通过示例解释了如何使用JavaScript实现点击按钮进行页面跳转，并详细分析了`_self`和`_blank`在页面跳转中的不同行为。同时，还展示了如何关闭当前页面的功能，以及`document.write()`对页面内容的影响。

摘要由CSDN通过智能技术生成

实例解释

html

 <ul>
    <li>
      hahah
    </li>
  </ul>
  <button>点我跳转</button>
  <button class="btn2">点我关闭</button>

    var oul = document.querySelector("ul");
    var btn = document.querySelector("button");
    var btn2 = document.getElementsByClassName("btn2")[0]
    btn.onclick = function () {
      open("http://www.baidu.com","_black","width=200px,height=200px")
      //我尝试了一下第二个参数
      //如果不写第二个参数默认是打开一个新页面并显示你要跳转的内容
      //但是有个弊端是这样你就不能设置第三个属性打开的新页面的宽高了

      //如果写"_self"那么效果就是当前页面跳转到新页面
      //但是有个奇怪的地方就是，如果你在open语句下面写document.write("")他就不发生跳转 
	  //会直接清除页面内容(这个理解貌似有误，提示我自己所以没有删除)
	   
	  //后来想了一下 应该是它发生了跳转不过"_self"的效果是当前页面跳转，所以先运行了跳转然后马上就
	  //运行了删除页面内容 所以在我们看来是什么都没发生
  
      //当第二个属性为"_black"时可以设置第三个参数的新打开页面的大小

      document.write("")
      //将本来的页面内容清空
    }
    btn2.onclick = function () {
		//关闭当前页面 -----chrome浏览器是不会询问用户直接关闭
      window.close()
    }