JavaScript フォールトトレラント処理コード (JS エラーのシールド)

JavaScript フォールトトレラント処理コード (JS エラーのシールド)_JavaScript スキル

PHP中文网

リリース： 2016-05-16 19:04:00

オリジナル

1000 人が閲覧しました

Web を閲覧すると、IE ブラウザの左下隅に常に黄色のエラーマークが表示され、直接エラーが表示され、ページの閲覧を続行できない場合があります。ウェブサイトの正式かつ権威ある開発。

外国銀行のページでこのようなエラーが発生したため、多くのユーザーが失われ、その銀行のオンラインバンキングを利用することを恐れ、多額の損失が発生しています。

つまり、ユーザーエクスペリエンスと会社の体力の点で発生することは許されない間違いであり、たとえそれが使用に影響を与えず、ユーザーを怒らせなかったとしても、Script House はすべての人にとってより良いコードを改善することに常に取り組んできました。ということで、ここではよく使われるコードとその使い方を整理していきますので、今後とも皆様のますますのご支援、ご協力を賜りますようお願い申し上げます。

最初のタイプ: スクリプトハウス自体も

を使用します。コードは次のとおりです。

<SCRIPT language=javascript> 
<!-- 
window.onerror=function(){return true;} 
// --> 
</SCRIPT>

ログイン後にコピー

方法use : 上記のコードをエラー Web ページの先頭領域に追加するだけです。

2 番目のタイプ: スクリプトエラーにより閲覧できない場合があるページを対象としています。この問題は非常に深刻であり、その結果、ユーザーが大量に失われるか、使用不能になります。
これは単純なスクリプトエラーではありません。主な理由は、コードの作成者が完全性を考慮していないことです。しかし、本当に修正する必要があるかどうかがわからない場合は、使用してください。このような code
try...catch では、コード内のエラーをテストできます。 try セクションには実行する必要があるコードが含まれ、catch セクションにはエラーが発生したときに実行されるコードが含まれます。
構文:

コードは次のとおりです:

try 
{ 
//在此运行代码 
} 
catch(err) 
{ 
//在此处理错误 
}

ログイン後にコピー

注: try...catch では小文字が使用されます。大文字は間違ってしまいます。
例 1
次の例は元々、ユーザーがボタンをクリックしたときに「ようこそゲスト!」というメッセージを表示するために使用されていました。ただし、message()関数内のalert()が誤ってaddlert()と書かれています。この時点でエラーが発生しました:

 
<html> 
<head> 
<script type="text/javascript"> 
function message() 
{ 
adddlert("Welcome guest!") 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

ログイン後にコピー

エラーが発生したときにより適切な措置を講じることができるように、try...catch ステートメントを追加できます。
次の例では、try...catch ステートメントを使用してスクリプトを再変更します。誤ってalert()を記述したためにエラーが発生しました。ただし、今回は、catch セクションがエラーをキャッチし、準備されたコードで処理します。このコードは、何が起こったかをユーザーに知らせるためのカスタムエラーメッセージを表示します。

 
<html> 
<head> 
<script type="text/javascript"> 
var txt="" 
function message() 
{ 
try 
{ 
adddlert("Welcome guest!") 
} 
catch(err) 
{ 
txt="此页面存在一个错误。\n\n" 
txt+="错误描述: " + err.description + "\n\n" 
txt+="点击OK继续。\n\n" 
alert(txt) 
} 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

ログイン後にコピー

例 2
次の例では、確認ボックスが表示され、ユーザーは、エラーが発生した場合に [OK] ボタンをクリックして Web ページの閲覧を続行するか、[キャンセル] ボタンをクリックして Web ページの閲覧を続けるかを選択できます。ホームページに戻ります。 confirm メソッドの戻り値が false の場合、コードはユーザーを別のページにリダイレクトします。確認メソッドが true を返した場合、コードは何も行いません。

 
<html> 
<head> 
<script type="text/javascript"> 
var txt="" 
function message() 
{ 
try 
{ 
adddlert("Welcome guest!") 
} 
catch(err) 
{ 
txt="There was an error on this page.\n\n" 
txt+="Click OK to continue viewing this page,\n" 
txt+="or Cancel to return to the home page.\n\n" 
if(!confirm(txt)) 
{ 
document.location.href="http://www.w3school.com.cn/" 
} 
} 
} 
</script> 
</head> 
<body> 
<input type="button" value="View message" onclick="message()" /> 
</body> 
</html>

ログイン後にコピー