JavaScript 高度なプログラミング読書メモ (15) ブラウザーでの JavaScript_javascript スキル

Window对象

窗口操作
　　Window对象对操作浏览器窗口非常有用，开发者可以移动或调整浏览器窗口的大小。可用四种方法实现这些操作：
　　moveBy(dx,dy)：把浏览器窗口相对当前位置水平移动dx个像素，垂直移动dy个像素。dx值为负左移，dy为负上移。
　　moveTo(x,y)：移动浏览器窗口，使它的左上角位于用户屏幕的(x,y)处。可以使用负数，不过这样会把部分窗口移出屏幕的可视区域。
　　resizeBy(dw,dh)：相对浏览器窗口当前大小，把窗口的宽度调整dw个像素，高度调整dy个像素。dw、dy为负时缩小窗口。
　　resizeTo(w,h)：把窗口的宽度调整为w，高度调整为h，不能使用负数。

注，FireFox跟Chrome默认不允许进行此操作，要在安全设置里更改

效果(在IE浏览器中有效果)：

<meta charset="utf-8"> <title>JavaScript窗口操作</title> <script type="text/javascript"> function moveByF(){ top.window.moveBy(100,100); } function moveToF(){ top.window.moveTo(100,100); } function resizeByF(){ top.window.resizeBy(100,100); } function resizeToF(){ top.window.resizeTo(100,100); } </script> <input type="button" onclick="moveByF()" value="moveBy"> <input type="button" onclick="moveToF()" value="moveTo"> <input type="button" onclick="resizeByF()" value="resizeBy"> <input type="button" onclick="resizeToF()" value="resizeTo">
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

导航和打开新窗口

　　导航和打开新窗口用 window.open() 方法，该方法接受四个参数，即要载入新窗口的页面的URL，新窗口名字，特性字符串和说明是否用新载入的页面替换当前载入的页面的Boolean值。一般只用前三个参数，最后一个参数只有在window.open()打不开新窗口时才有效。

　　第三个参数可选值如下：

top=pixels窗口的 y 坐标。

left=pixels	窗口的 x 坐标。以像素计。
height=pixels	窗口文档显示区的高度。以像素计。
width=pixels	窗口的文档显示区的宽度。以像素计。
resizable=yes|no	窗口是否可调节尺寸。默认是 yes。
scrollable=yes|no	是否显示滚动条。默认是 yes。
location=yes|no	是否显示地址字段。默认是 yes。
status=yes|no	是否添加状态栏。默认是 yes。
toolbar=yes|no	是否显示浏览器的工具栏。默认是 yes。

特性字符串是以逗号分隔的，所以在逗号或等号后不能有空格。

示例：

<meta charset="utf-8"> <title>JavaScript打开新窗口</title> <script type="text/javascript"> function open_win() { window.open("http://www.cnblogs.com","_blank","width=800,height=400,left=100,top=100") } </script> <input type="button" value="打开窗口" onclick="open_win()">
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

document对象

　　用document的open、write、close等方法可以向新打开的窗口中写入内容，如下所示：

复制代码 代码如下:

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

もっと見る

人気の記事

アサシンのクリードシャドウズ：シーシェルリドルソリューション

3週間前 By DDD

Windows11 KB5054979の新しいものと更新の問題を修正する方法

2週間前 By DDD

Atomfallのクレーンコントロールキーカードを見つける場所

3週間前 By DDD

アサシンクリードシャドウ - 鍛冶屋を見つけて武器と鎧のカスタマイズを解除する方法

1 か月前 By DDD

<🎜>：Dead Rails-すべての課題を完了する方法

3週間前 By DDD

もっと見る

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？

7633

15

CakePHP チュートリアル

1390

52

Steamのアカウント名の形式は何ですか

89

11

Win11 Activation Key Permanent

71

19

NYTの接続はヒントと回答です

32

145

もっと見る

Related knowledge

Webページにローカルにインストールされている「Jingnan Mai Round Body」を正しく表示するにはどうすればよいですか？ Apr 05, 2025 pm 10:33 PM

最近、Webページにローカルにインストールされたフォントファイルを使用して、インターネットから無料のフォントをダウンロードし、システムに正常にインストールしました。今...

JavaScriptまたはCSSを介してブラウザ印刷設定でページの上部と終了を制御する方法は？ Apr 05, 2025 pm 10:39 PM

JavaScriptまたはCSSを使用して、ブラウザの印刷設定のページの上部と端を制御する方法。ブラウザの印刷設定には、ディスプレイが...

ネガティブマージンが場合によっては効果がないのはなぜですか？この問題を解決する方法は？ Apr 05, 2025 pm 10:18 PM

なぜマイナスマージンが場合によっては有効にならないのですか？プログラミング中、CSSの負のマージン（負...

Webページにローカルにインストールされたフォントファイルを使用する方法は？ Apr 05, 2025 pm 10:57 PM

Webページにローカルにインストールされたフォントファイルを使用する方法Webページ開発でこの状況に遭遇しましたか：コンピューターにフォントをインストールしました...

フレックスレイアウトの下のテキストは省略されていますが、コンテナは開かれていますか？それを解決する方法は？ Apr 05, 2025 pm 11:00 PM

フレックスレイアウトとソリューションの下でのテキストの過度の省略によるコンテナの開口部の問題が使用されます...

CSSで要素を回転させることにより、水平オプションの水平スクロール効果を実現する方法は？ Apr 05, 2025 pm 10:51 PM

CSSにおける水平オプションの水平スクロール効果を実現する方法は？最新のWebデザインでは、水平方向のタブのような効果を実現し、マウスをサポートする方法...

Vant Popupコンポーネントには3つのDIVにギャップがあります。どのCSSスタイルが原因であるのですか？ Apr 05, 2025 pm 11:12 PM

ヴァンテ...

適応設計でREMユニットを調整して、高さの問題を解決する方法は？ Apr 05, 2025 pm 11:03 PM

適応設計の高さ調整の問題を解決する方法は？適応設計では、高さの調整はしばしば困難な問題です。特に同様に対処するとき...

See all articles