如何用js来判断浏览器的宽度然后改变大小

你可以使用 `window.innerWidth` 属性来获取浏览器窗口宽度，然后根据宽度的大小来改变元素的大小。

以下是一个简单的示例代码：

if (window.innerWidth < 768) {
  // 如果浏览器宽度小于768px，就改变某些元素的大小
  document.getElementById("myElement").style.width = "50%";
} else {
  document.getElementById("myElement").style.width = "100%";
}

在上面的示例中，如果浏览器宽度小于768px，就将 `myElement` 元素的宽度设置为50%。如果浏览器宽度大于等于768px，则将其宽度设置为100%。

你可以根据自己的需要进行修改。

相关问题

vue3设置浏览器不可改变大小

Vue 3是一个流行的JavaScript框架，用于构建用户界面。虽然Vue本身并没有提供直接的方法来设置浏览器窗口的大小，但我们可以使用其他方法来实现这个目标。

首先，我们可以用CSS样式来限制浏览器窗口的大小。通过设置`max-width`和`max-height`属性，我们可以限制窗口的最大尺寸，从而防止用户改变浏览器大小。例如，我们可以设置body元素的样式如下：

body {
  max-width: 1000px;
  max-height: 800px;
}

这样，当用户尝试调整浏览器窗口大小时，窗口将无法超过指定的宽度和高度。

另外，我们还可以使用JavaScript来捕捉浏览器窗口大小改变的事件，并在事件发生时将窗口大小重置为指定的大小。例如，我们可以在Vue实例的`mounted`生命周期钩子函数中添加以下代码：

mounted() {
  window.addEventListener('resize', () => {
    window.resizeTo(1000, 800);
  });
}

这样，每当用户尝试改变窗口大小时，窗口都会被强制重置为指定的宽度和高度。

需要注意的是，尽管我们可以限制浏览器窗口的大小，但用户仍然可以通过其他手段（如浏览器开发工具）来绕过这些限制。这只是一种简单的保护措施，不能完全防止用户改变浏览器大小。

用JS判断浏览器刷新还是关闭并兼容各大浏览器

可以使用 `beforeunload` 事件来判断浏览器是刷新还是关闭，并且该事件是兼容各大浏览器的。

以下是判断浏览器是刷新还是关闭的示例代码，并且兼容各大浏览器：

// 判断是否是刷新
var isRefresh = false;
window.onbeforeunload = function(event) {
  var e = window.event || event;
  // 判断是否是刷新
  if (e.clientX > document.body.clientWidth && e.clientY < 0 || e.altKey) {
    isRefresh = true;
  } else {
    isRefresh = false;
  }
  // 兼容各大浏览器
  e.returnValue = "确定离开当前页面吗？";
  return "确定离开当前页面吗？";
};

// 判断是否是关闭
window.onunload = function() {
  if (!isRefresh) {
    console.log("浏览器正在关闭...");
  }
};

以上代码中，使用 `onbeforeunload` 事件来判断是否是刷新或关闭，并且使用 `onunload` 事件来判断是否是关闭，并且兼容各大浏览器。其中，`clientX` 和 `clientY` 属性用于判断是否是点击浏览器关闭按钮，`altKey` 属性用于判断是否是使用快捷键关闭浏览器。