Angular 2中如何程序化修改浏览器窗口大小？

嘿，这个问题我太懂了！你尝试直接给window.innerWidth和window.innerHeight赋值没效果完全正常——因为这俩属性是只读的，只能用来获取当前窗口的尺寸，根本没法通过赋值来修改窗口大小。

那正确的做法是什么呢？你得用浏览器提供的专门方法：window.resizeTo() 和 window.resizeBy()，下面给你详细拆解：

1. 使用 resizeTo() 直接设置目标尺寸 #

这个方法可以直接把窗口调整到你指定的宽度和高度，参数顺序是宽度在前，高度在后。比如你想把窗口改成500x500，代码就是：

window.resizeTo(500, 500);

2. 使用 resizeBy() 相对调整尺寸 #

如果你不想直接设置固定值，而是想在当前窗口大小的基础上增减尺寸，就用这个方法。参数是尺寸的变化量（负数就是缩小，正数就是放大）。比如当前窗口宽是800，想缩到500，就可以写：

// 宽度减少300，高度不变
window.resizeBy(-300, 0);

重要注意事项！ #

别高兴太早，现代浏览器为了用户体验和安全，对窗口大小修改加了不少限制：

• 只能修改脚本创建的窗口：如果你是在用户手动打开的标签页里运行这些代码，大概率会失效——只有通过你的脚本用window.open()创建的新窗口，才能被修改大小。举个完整的例子：

  // 先打开一个初始尺寸为800x600的新窗口
  const myWindow = window.open('', '_blank', 'width=800,height=600');
  
  // 等窗口加载完成后调整到500x500
  myWindow.onload = function() {
    myWindow.resizeTo(500, 500);
  };
  

• 有最小尺寸限制：不同浏览器都有自己的最小窗口宽高要求，你不能把窗口缩到比这个值还小，比如Chrome的最小宽度大概是400px左右。
• 全屏模式下无效：如果浏览器处于全屏状态，这些方法会直接被忽略。

所以下次别再给innerWidth赋值啦，用上面这两个方法才是正确的打开方式～

内容的提问来源于stack exchange，提问作者nemo