Web ページの JavaScript エッセンスコードセット

著者：Eve Cole 更新時間：2009-06-08 18:25:37

【1.通常のポップアップウィンドウ】
実際、コードは非常に単純です:

これは JavaScript コードの一部であるため、<SCRIPT LANGUAGE=javascript> タグと </script> の間に配置する必要があります。  は、一部の古いブラウザでは有効であり、タグ内のコードはテキストとして表示されません。この良い習慣を身につけてください。
window.open ('page.html') は、新しいウィンドウ page.html のポップアップを制御するために使用されます。page.html がメインウィンドウと同じパスにない場合は、そのパスを前に記述する必要があります。絶対パス ([url]http:// )[/url] と相対パス (../) の両方を使用できます。
一重引用符または二重引用符のいずれかを使用できますが、混合しないでください。
このコード部分は、HTML 内のどこでも (<head> と </head> の間、または <body> と </body> の間) 追加できます。コードが前にあるほど、特にページの場合はより早く実行されます。コードが長いので、ページをできるだけ前に表示したい場合。

【2.設定後のポップアップ画面】
ポップアップウィンドウの設定について話しましょう。上記のコードにもう少し追加するだけです。ページの特定の条件に合わせて、このポップアップウィンドウの外観、サイズ、ポップアップの位置をカスタマイズしてみましょう。

<スクリプト言語=javascript>

</SCRIPT>

パラメータの説明:

<SCRIPT LANGUAGE=javascript> js スクリプトが開始されます。
新しいウィンドウをポップアップする window.open コマンド。
'page.html' ポップアップウィンドウのファイル名。
'newwindow' ポップアップウィンドウの名前 (ファイル名ではありません) はオプションで、空の '' に置き換えることができます。
高さ=100 ウィンドウの高さ;
width=400 ウィンドウ幅;
top=0 画面からウィンドウの上のピクセル値。
left=0 画面の左側からのウィンドウのピクセル値。
toolbar=no ツールバーを表示するかどうか、yes を表示します。
メニューバー、スクロールバーはメニューバーとスクロールバーを表します。
resizable=no ウィンドウサイズの変更を許可するかどうか、yes を許可するかどうか。
location=no アドレスバーを表示するかどうか、yes を許可するかどうか。
status=no ステータスバーに情報を表示するかどうか (通常はファイルが開かれています)、yes が許可されます。
</SCRIPT> js スクリプトの終了

[3. 関数を使用してポップアップウィンドウを制御する]
以下は完全なコードです。
<html>
<頭>
<script LANGUAGE=javascript>

</script>
</head>
<body onload=openwin()>
..任意のページコンテンツ...
</body>
</html>

ここではopenwin()という関数が定義されており、その関数内容はウィンドウを開くというものです。呼び出されるまでは何の役にも立ちません。
なんと呼びますか？

方法 1: <body onload=openwin()> ブラウザがページを読み取るとウィンドウがポップアップします。
方法 2: <body onunload=openwin()> ブラウザがページを離れるとウィンドウがポップアップします。
方法 3: 接続を使用して通話する:
<a href=注: 「方法 4: ボタンで呼び出す:」を使用します。
<input type=button onclick=openwin() value=open window>

[4. 2 つのウィンドウが同時にポップアップします]

ソースコードにわずかな変更を加えます。
<script LANGUAGE=javascript>

</script>

2 つのポップアップウィンドウが重ならないようにするには、上と左を使用してポップアップの位置を制御し、重ならないようにします。最後に、上記の 4 つのメソッドを使用して呼び出すことができます。
注: 2 つのウィンドウ (newwindows と newwindow2) の名前は同じであってはなりません。同じでない場合は、すべて空にする必要があります。わかりました？

[5. メインウィンドウでファイル 1.htm が開き、同時に小さなウィンドウ page.html が表示されます]

次のコードがメインウィンドウの <head> 領域に追加されます:

[6. ポップアップウィンドウを閉じるタイミングの制御]

次に、ポップアップウィンドウの制御を実行します。これにより、効果が向上します。ポップアップページに小さなコードを追加した場合 (メインページではなく、page.html の HTML に追加されることに注意してください。そうでない場合は...)、ポップアップページが自動的に閉じた方がクールではないでしょうか。 10秒？

まず、次のコードを page.html ファイルの <head> 領域に追加します。
<script language=javascript>

function closeit() {

setTimeout(self.close(),10000) //ミリ秒

}

</script>
次に、文 <body onload=closeit()> を使用して、page.html 内の元の <BODY> 文を置き換えます。 (この文を忘れずに記述してください。この文の機能は、ウィンドウを閉じるコードを呼び出し、10 秒後に自動的にウィンドウを閉じることです。)

[7. ポップアップウィンドウに閉じるボタンを追加します。]
<フォーム>
<INPUT TYPE='BUTTON' value='Close' onClick='window.close()'>
</FORM>
笑、さらに完璧になりました！

[8. ポップアップウィンドウが含まれる - 1 ページに 2 つのウィンドウ]

上記の例にはすべて 2 つのウィンドウが含まれており、1 つはメインウィンドウ、もう 1 つは小さなポップアップウィンドウです。
次の例では、上記の効果を 1 ページで完了できます。

<html>
<頭>
<スクリプト言語=javascript>
関数openwin()
{
OpenWindow=window.open(, newwin, height=250, width=250,toolbar=no,scrollbars=+scroll+,menubar=no);
//一行で書く
OpenWindow.document.write(<TITLE>例</TITLE>)
OpenWindow.document.write(<BODY BGCOLOR=OpenWindow.document.write(<h1>こんにちは!</h1>)
OpenWindow.document.write(新しいウィンドウが開きました!)
OpenWindow.document.write(</BODY>)
OpenWindow.document.write(</HTML>)
OpenWindow.document.close()
}
</スクリプト>
</head>
<本文>
<a href=<input type=button onclick=openwin() value=ウィンドウを開く>
</body>
</html>

OpenWindow.document.write() のコードを見てください。これは標準の HTML ではないでしょうか。フォーマットに従ってさらに行を書くだけです。ラベルが1つ多かったり減ったりするとエラーとなりますので注意してください。 OpenWindow.document.close() で終了することを忘れないでください。

[9. 究極のアプリケーション -- ポップアップウィンドウの Cookie 制御]

上のポップアップウィンドウはクールですが、少し問題があることを思い出してください (喜びに浸っていると気付かないはずです?)。たとえば、上記のスクリプトを入れると、頻繁に通過する必要があるページ（ホームページなど）では、ページを更新するたびにウィンドウがポップアップしてしまい、非常に迷惑ではありませんか？ :-(
解決策はありますか?はい! ;-) フォローしてください。
Cookie を使用して制御できます。
まず、メインページ HTML の <HEAD> 領域に次のコードを追加します。

loadpopup(){
if (get_cookie('popped')==''){
オープンウィン()
document.cookie=ポップ=はい
}
次に

、メインページの元の <BODY> 文を <body onload=loadpopup()> に置き換えます (openwin ではなく、loadpop! であることに注意してください)

。

ページを更新するか、ページに再度アクセスしてみると、ウィンドウが再度ポップアップすることはありません。真のポップオンリーワンス!

ここまでで、ポップアップウィンドウの作成と応用スキルはほぼ完成しました。Web ページを作成している友人の役に立てば幸いです。。
JS スクリプトでは大文字と小文字を一貫して使用することが最善であることに注意してください。

1. 全画面ウィンドウ

<html>

をポップアップ表示します。

2. F11 キーを押したウィンドウをポップアップします

3. お気に入りリンクツールバーのあるウィンドウをポップアップします

4. Web ページダイアログボックス

<html>
<スクリプト言語=javascript>

</スクリプト>
<b> target=_blank>[url]http://www.pconline.com.cn[/url]</b>
</body>
</html>

showModalDialog() または showModelessDialog() を使用して Web ダイアログボックスを呼び出します。 showModalDialog() と showModelessDialog() の違いは、showModalDialog() によって開かれたウィンドウ (略してモーダルウィンドウ) が親ウィンドウに配置されることです。親ウィンドウにアクセスするには閉じる必要があります (人を不快にさせないように、できるだけ使用しないことをお勧めします)。 showModelessDialog() (モードレスウィンドウと呼ばれます) を閉じずに、親ウィンドウによって開かれたウィンドウにアクセスできます。開封後。

DialogHeight: iHeight はダイアログウィンドウの高さを設定します。
DialogWidth: iWidth はダイアログウィンドウの幅を設定します。
DialogLeft: iXPos は、デスクトップの左上隅を基準としたダイアログウィンドウの左位置を設定します。
DialogTop: iYPos は、デスクトップの左上隅を基準としたダイアログウィンドウの上部の位置を設定します。
center: {yes | no | 0} ダイアログボックスをデスクトップの中央に配置するかどうかを指定します。デフォルト値は「yes」です。
help: {yes | no | 0 } ダイアログウィンドウに状況依存のヘルプアイコンを表示するかどうかを指定します。デフォルト値は「はい」です。
resizable: {はい | いいえ | 0} ダイアログウィンドウのサイズを変更できるかどうかを指定します。デフォルト値は「いいえ」です。
status: {yes | no | 0} ダイアログウィンドウにステータスバーを表示するかどうかを指定します。デフォルト値は、モードレスダイアログウィンドウの場合は「yes」、モーダルダイアログウィンドウの場合は「no」です。

Web ページのクラシックコード
1. マウスの右ボタンが完全にブロックされ、右クリックメニューが表示されなくなります。
<body oncontextmenu=window.event.returnvalue=false> は、

Web ページのテーブルフレームでも使用できます。
<table border oncontextmenu=return(false)><td>いいえ</table>

2. 選択を解除してコピーを禁止します
<body onselectstart=return false>

3. 貼り付け禁止
<body onpaste=return false>

4. コピーを防止する
<body oncopy=return false; oncut=return false;>

5. IEのアドレスバーを独自のアイコンに変更する
<link rel=Shortcut Icon href=favicon.ico>

説明: favicon.ico ファイルの作成について。まず、FW で画像、つまり自分のサイトの小さなアイコンを作成できます。次に、ACD でファイル属性を *.ico に変更し、作成した *.ICO ファイルをサーバーディレクトリに転送します。その後、他の人があなたのサイトにログインするときに、上記のコードを使用してこれを実現できます。バーカスタムアイコンを使用します。

6. 自分のアイコンをお気に入りに表示できる
<link rel=Bookmark href=favicon.ico>

作り方: 作成方法は上記と同じです。表示方法が異なるだけです。これは、他の人があなたの Web アドレスをブックマークしたときに表示される個人用アイコンです。

7. インプットメソッドを閉じます
<input style=ime-mode:disabled>

説明: このコードは、フォームを送信するときに使用されます。つまり、データ入力時に他の入力方式モードは使用できません。

8. 常にフレームワークを持ち歩く
<script language=javascript></script>

説明: Frame.htm は Web ページです。これはページを保護する方法でもあります。

9. はめられないようにする
<スクリプト言語=javascript></SCRIPT>

10. Web ページは次の名前で保存されません。
<noscript><iframe src=*.html></iframe></noscript>
注: <noscirpt> には幅広い用途があり、その 1 つは JS 広告を無効にすることです。

11. ソースファイルの確認
<input type=button value=Web ページのソースコードを表示
onclick=window.location = 'view-source:'+ target=_blank>[url]http://bbs.055.cn/test.htm[/url]';>

12.COOKIEスクリプトレコードはとても便利です

function get_cookie(Name) {
var search = Name + =

var returnvalue = ;

if (documents.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) { // Cookie が存在する場合

offset += 検索。 length

// 値の先頭のインデックスを設定します

end = document.cookie.indexOf

(

;, offset)

// Cookie 値の末尾のインデックスを設定します

if (end == -1)

end = document.cookie.length;

(documents.cookie.substring(offset, end))

}

戻り値を返します

。

functionloadpopup(){

if (get_cookie('popped')==''){

openpopup()

documents.cookie=popped=yes

}

注: 上記は JS コードです。開始文字と終了文字は自分で追加してください。

13. インナーフレーム<IFRAME>の使用
Iframe タグの使用形式は次のとおりです。

例: <iframe name=mm src=http://bbs.055.cn;; width=100% height=100% marginwidth=0 marginheight= ... ot

;ソースコード内の <head>…</head> に自動的にジャンプするには、次のコードを追加します。
<meta http-equiv=refreshcontent=3;URL=http://bbs.055.cn;

説明: content=3 は 3 秒以内に URL を更新することを意味します。

15. リンクのマウスの形状を変更するには、このコードをリンクに追加するだけですか? または、上記のように CSS で記述することもできます。

style=cursor:hand style=cursor:crosshair
スタイル=カーソル:テキストスタイル=カーソル:待機
style=カーソル:移動 style=カーソル:ヘルプ
style=カーソル:電子サイズ変更
style=cursor:n-resize
style=cursor:nw-resize style=cursor:w-resize
style=カーソル:s-resize
style=cursor:se-resize
style=cursor:sw-resize

マウスを多様化するには、ページのリンクまたはスタイル領域に上記のコードを追加するだけです。

16.全画面表示
<フォーム>
<div align=center>
<input type=BUTTON name=FullScreen value=フルスクリーン onClick=window.open(document.location, 'big', 'fullscreen=yes')>
</div>
</form>

<body> 領域に配置します。

17. ホームページとして設定

if(適切なバージョン>=5){
フォーカスok = true;
}
関数 launchstock1(htmlurl){
var Stock=window.open(htmlurl,stock,top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,
サイズ変更可能=いいえ、幅= 700、高さ= 510;
if(フォーカスコック){
在庫.focus();
}
true を返します。
}
関数 launchstock(){
var Stock=window.open(,stock,top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,

resizable=no,width=700,高さ=510;
if(フォーカスコック){
在庫.focus();
}
true を返します。
}
// -->
</script>
<a href=# name=home onClick=defaul_home(); title===E 世代時間==>ホームページとして設定</a>

18. お気に入りを追加するためのコードは次のとおりです

<a href=# onClick=window.external.addFavorite([url]http://bbs.055.cn[/url]';.'Dawn Accord') target=_self title = ドーンアコード>お気に入りに追加</a>

19. 以下のフラッシュ画像効果のコードが <head> 領域に追加されます。
<SCRIPT言語=javascript>
<!--
関数 makevisible(cur,that){
if (どれ==0)
cur.filters.alpha.opacity=100
それ以外
cur.filters.alpha.opacity=20
}

//-->

</SCRIPT>
以下のコードが <body> 領域に追加されます。
<img src=/u/info_img/2009-06/08/logo.gif;; style=filte ... nbsp;onMouseOver=makevisible(this,0) onMouseOut=makevisible(this,1) width=63 height=56 > //画像アドレスはご自身で変更してください

20.読み込み進行状況バー

<table cellpacing=0 cellpadding=0 bgcolor=#FFFFFF width=40% id=P><tr><td>
<table cellpacing=0 cellpadding=0 bgcolor=#0000FF height=18 id=Q><tr><td></td></tr></table></td></tr></table>
</center>
<スクリプト言語=javascript>
var R = 0;
関数load() {R = R + 2; Q.style.width = R + % time= setTimeout(),50;
if (R > 100) {clearTimeout(time)=0}}
</script>
27 フルスクリーン
<スクリプト言語=javascript>
window.open('index.asp','','fullscreen=1');
</script>

21. 背景画像スクロール

<bodyscroll=nobackground=images/bg.jpg link=#00FF00 alink=#FF0000 vlink=#00FF00 bgcolor=#000080 topmargin=8>
<スクリプト言語=javascript>
var 背景オフセット = 0;
var bgObject = eval('document.body');
関数scrollBG(maxSize) {backgroundOffset = backgroundOffset + 1;
if (backgroundOffset > maxSize) backgroundOffset = 0;
bgObject.style.backgroundPosition = 0 +backgroundOffset;}
varScrollTimer = window.setInterval(scrollBG(410), 20)
</script>

22.Web ページは

HTMl ページに

キャッシュされません

<META HTTP-EQUIV=pragma CONTENT=no-cache>
<META HTTP-EQUIV=キャッシュ制御 CONTENT=キャッシュなし、再検証が必要>
<META HTTP-EQUIV=expires CONTENT=水曜日、1997 年 2 月 26 日 08:21:57 GMT>
または <META HTTP-EQUIV=expires CONTENT=0>
ASP webpageResponse.Expires = -1
Response.ExpiresAbsolute = Now() - 1
Response.cachecontrol = キャッシュなし
PHPウェブページ
ヘッダー(有効期限: 1997 年 7 月 26 日月曜日 05:00:00 GMT;
header(キャッシュ制御: キャッシュなし、再検証が必要;
header(プラグマ: キャッシュなし;

23.

<%
'データベース接続用の定数を定義します
Const adOpenForwardOnly = 0 'カーソルはレコードを前方に参照するだけで、ページング、Recordset、BookMark はサポートしません。
Const adOpenKeyset = 1 'キーセットカーソル。他のユーザーがレコードに加えた変更はレコードセットに反映されますが、他のユーザーが追加または削除したレコードはレコードセットに反映されません。ページング、レコードセット、ブックマークをサポート
Const adOpenDynamic = 2 '動的カーソルは最も強力な機能を備えていますが、最も多くのリソースを消費します。ユーザーがレコードに加えた変更、レコードの追加または削除は、レコードセットに反映されます。フル機能のブラウジングをサポートします (ACCESS ではサポートされていません)。
Const adOpenStatic = 3 '静的カーソルは、ユーザーがレコードに加えた変更、レコードの追加または削除はレコードセットには反映されません。前進または後退をサポートします
Const adLockReadOnly = 1 'ロックタイプ、デフォルト、読み取り専用、変更はできません
Const adLockPessimistic = 2 '編集時にレコードをすぐにロックします。最も安全な方法です。
Const adLockOptimistic = 3 'レコードセットは Update メソッドが呼び出された場合にのみロックされ、以前の他の操作によって現在のレコードが変更、挿入、削除される可能性があります。
Const adLockBatchOptimistic = 4 '編集時にレコードはロックされず、変更、挿入、削除はバッチモードで行われます。
Const adCmdText = &H0001
Const adCmdTable = &H0002
%>

24. ウィンドウの最小化、最大化、および閉じる
<object id=hh1 classid=clsidDB880A6-D8FF-11CF-9377-00AA003B7A11>
<param name=コマンド値=最小化></object>
<object id=hh2 classid=clsidDB880A6-D8FF-11CF-9377-00AA003B7A11>
<param name=コマンド値=最大化></object>
<OBJECT id=hh3 classid=clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11>
<PARAM NAME=コマンド値=閉じる></OBJECT>
<入力タイプ=ボタン値=最小化onclick=hh1.Click()>
<入力タイプ=ボタン値=onclick=hh2.Click()を最大化>
<input type=button value=Close onclick=hh3.Click()>

注: この例は IE に適しています

25. 前のページの ASP ページのソースを特定します

。
request.servervariables(HTTP_REFERER
JavaScript:
ドキュメント.リファラー

26. カーソルはテキストボックス内のテキストの末尾で停止します

説明: フォームデータの送信に適しています

Web ページの JavaScript エッセンス コード セット

Web ページの JavaScript エッセンスコードセット