1.JavaScript-BOM開口
1. BOMとは何ですか？
DOMは、HTMLタグのセットは、APIを操作している（インターフェイス/メソッド/プロパティ）
BOMは、ブラウザ操作のAPI（インタフェース/メソッド/プロパティ）であります
2.BOM共通オブジェクト
ウィンドウ：ブラウザウィンドウの代表
注：ウィンドウは、BOMのオブジェクトであり、上部の標的である（グローバル）
ナビゲーター：私たちがどのようなユーザーの現在のブラウザを決定することができナビゲータによって、現在のブラウザに代わって情報
場所：私たちは現在のアドレス情報を設定したり、取得することができます場所によって、ブラウザのアドレスバーに代わって情報を、
歴史：これは歴史によって/次のステップに/ワンステップをリフレッシュするために、ブラウザの履歴情報を意味し、
注意事項：プライバシー上の理由から、我々は現在の履歴を取得することができ、すべてのユーザーの履歴を取得することはできません
画面：ユーザー情報の代わりに画面
2.JavaScript-ナビゲーター
//ナビゲーター：ナビゲータによって、現在のブラウザに代わって情報を私たちはどのようなユーザーの現在のブラウザを決定することができます
console.log（ウィンドウナビゲータ。）;
VARエージェント= window.navigator.userAgent。
（/chrome/i.test(agent））{//エージェントはで指定された文字列が含まれている場合
警告（「現在はGoogleのブラウザです」）
}そうであれば（/firefox/i.test(agent））{
警告（ "現在のFirefox"）
}そうであれば（/msie/i.test(agent））{
警告（「電流が低く、IEブラウザです」）
}他の場合（ウィンドウに「ActiveXオブジェクト」）{
警告（「現在のシニアIEブラウザ」）
}
非常に多くの方法、独自の検索
3.JavaScript-場所
<ボタンID = "BTN1">获取</ボタン>
<ボタンID = "BTN2">设置</ボタン>
<ボタンID = "btn3">刷新</ボタン>
<ボタンID = "btn4"> </ button>のリフレッシュを強制
<スクリプト>
//場所：我々は現在のアドレス情報を設定したり、取得することができます場所によって、ブラウザのアドレスバーに代わって情報を、
聞かせてoBtn1 = document.querySelector（ "＃のBTN1"）;
聞かせてoBtn2 = document.querySelector（ "＃のBTN2"）;
聞かせてoBtn3 = document.querySelector（ "＃のbtn3"）;
聞かせてoBtn4 = document.querySelector（ "＃のbtn4"）;
//アドレスバーの現在のアドレスを取得します。
oBtn1.onclick =関数（）{
console.log（window.location.href）。
}。
//現在のアドレスバーのアドレスを設定します
oBtn2.onclick =関数（）{
window.location.href = "http://www.it666.com"。
}。
//リロードインターフェース
oBtn3.onclick =関数（）{
window.location.reload（）; //メソッドデフォルトのリフレッシュをリロードするには、必ずしもキャッシュをフラッシュしません
}
oBtn3.onclick =関数（）{
window.location.reload（真の）; //リフレッシュ強制：真書き込むための方法をリロードします。これは、キャッシュを更新します
}
4.JavaScript-歴史
歴史：これは歴史によって/次のステップに/ワンステップをリフレッシュするために、ブラウザの履歴情報を意味し、
注意事項：プライバシーの配慮のため、私たちは現在の履歴を取得することができ、すべてのユーザーの履歴を取得することはできません
1.フォワード
方法A：window.history.forward（）;
私たちは、一度だけ使用した後、前方に行くことができます
方法2：window.history.go（1）。
あなたは、複数のページを転送することができます
2.更新
この方法は、リフレッシュに代わって、0を行くために渡された場合。window.history.go（0）。
3.戻ります
方法A：window.history.back（）;
一度だけ使用した後バックで
方法2：window.history.go（1）。
あなたは、複数のページを戻ることができます
5.JavaScript-offsetWidthHeightは、要素の幅と高さを取得しました
要素の幅と高さを取得します。
方法a：getComputedStyle（）
注意点：
（）パディング（パディング）および境界（ボーダー）を含まない、高getComputedStyle幅で得られました。
幅と高さは、ラインセットで取得することができる設けCSSの幅と高さを取得することができます
アクセスのみをサポートし、設定をサポートしていません。
唯一のIE9と上記のブラウザをサポート
// oDiv.style.width = "555px";
// oDiv.style.height =「555px」; //は、JSを提供幅と高さを取得することができます。
VARのスタイル= getComputedStyle（ヒスノイズ）。
// style.width = "666px";
// style.height =「666px」; //プロパティは読み取り専用です設定をサポートしていません。
console.log（style.width、style.height）。
方法2：幅によって取得し、高さはcurrentStyle属性
注意点：
パディング（パディング）および境界（ボーダー）を含まない幅と高さによって取得CurrentStyle、。
幅と高さは、ラインセットで取得することができる設けCSSの幅と高さを取得することができます
アクセスのみをサポートし、設定をサポートしていません。
IE9は、以下のブラウザをサポートしています
// oDiv.style.width = "555px";
// oDiv.style.height = "555px";
style.width = "666px";
style.height = "666px";
VARのスタイル= oDiv.currentStyle。
//にconsole.log（スタイル）;
console.log（style.width）。
console.log（style.height）。
方法3：幅広いスタイル属性の高スループット
パディング（詰め物）との国境（ボーダー）を含まないスタイルの幅と高さ、によって獲得されます。
ラインに設け幅と高さを取得することができ、あなたは、幅と高さのセットCSSを得ることができません
サポート、サポートの設定を取得します。
高度な低レベルのブラウザをサポートしています
oDiv.style.width = "555px";
oDiv.style.height = "555px";
console.log（oDiv.style.width、oDiv.style.height）。
方法4：offsetWidth / offsetHeightプロパティによって幅と高さを取得します。
パディング（パディング）との境界（ボーダー）を含む、offsetWidth / offsetHeight幅と高さで得られます。
ラインに設け幅と高さを取得することができ、あなたは、幅と高さのセットCSSを得ることができません
アクセスをサポートし、設定をサポートしていません。
高度な低レベルのブラウザをサポートしています
oDiv.offsetWidth = "555px";
oDiv.offsetHeight = "555px";
console.log（oDiv.offsetWidth）。
console.log（oDiv.offsetHeight）。
要約：
1.getComputedStyle（）、currentStyle、スタイル
パディング（詰め物）との国境（ボーダー）を含まない幅と高さを、取得します。
2.offsetWidth / offsetHeight
パディング（詰め物）との境界線（ボーダー）を含む、幅と高さを取得します。
3..getComputedStyle（）、currentStyle、offsetWidth / offsetHeight
アクセスをサポートし、設定をサポートしていません。
4.style
サポート、サポートの設定を取得します。
5..getComputedStyle（）、currentStyle、offsetWidth / offsetHeight
行を取得することができる、そして鎖はまた、インラインスタイルを得ることができます
6.style
インラインスタイルのみを取得します
6.JavaScript-offsetLeftTop要素の位置を取得します
offsetLeftとoffsetTop役割
第一位置決め祖先との間の位置をオフセットする要素を取得します
何の祖先要素に位置しているが存在しない場合、それはオフセット位置の体内に入るためにあります
7.JavaScript-offsetParentの
1.offsetParentの役割
第一位置決め祖先の要素を取得します。
何の祖先要素が配置されていないが存在する場合、体であることを得ます
8.JavaScript-クライアント関連のプロパティ
clientWidth =内幅+マージン
clientHeight =高さ+パディング
offsetWidth =フレーム幅+パディング+
offsetHeight = +高さ+パディングボーダー
clientLeft =左の境界
clientTop =上部の境界線
offsetLeft / offsetTop：第1シフトポジション先祖体との間の距離を位置決めする||
9.JavaScript-スクロール関連のプロパティ
1.コンテンツ要素の範囲を超えていません
scrollWidth =素子幅+マージン幅== clientWidth
scrollHeight = +パディング要素高さの高さ== clientHeight
2.要素の範囲を超えています
マージン幅scrollWidth =要素の幅が幅を超える++
scrollHeight = +パディング要素の高さが高さの高さを超えて+
3.scrollTop / scrollLeft
scrollTopスプライト：トップ要素の内側の余白を超えた距離
scrollLeft：内部要素の左マージンを越えた距離
JavaScript- 3人の家族
三組の家族：オフセット、クライアント、スクロール
23.JavaScript-手ぶれ補正機能
質問：Baiduの入力ボックスで、文字を入力するには、要求後に送信されます、それはパフォーマンスの問題を持っています
ソリューション：与えられた期間は、ユーザの入力が連続していないかどうかを判断します。与えられた期間を使用して
1.画像安定化（デバウンス）の機能は何ですか？
画像安定化機能は、高周波JSコードの最適化を実行するための手段であります
これは、呼び出された関数が動作中に連続した高頻度に一度だけ呼び出されることができます
手ぶれ補正機能の2役
ウェブサイトのパフォーマンスを向上させ、コード実行の数を減らします
3.手ブレ補正機能のシナリオ
oninput /れるonmousemove / onscroll /さらにonResize操作
4.問題の安定化機能：
一度だけ呼ばれ、その変化の過程を見ていない、我々は唯一の最終結果を見ることができます
ソリューション：スロットル機能を使用します
<input type = "text">
<スクリプト>
せoInput = document.querySelector（ "入力"）。
timerIdの= nullをしましょう。
oInput.oninput =関数（）{//コンテンツが変化するかどうかを監視します
値= this.valueてみましょう
timerIdの&&てclearTimeout（れるtimerId）;
timerIdが=のsetTimeout（関数（）{
console.log（値、「ネットワーク要求」）。
}、1000）。
//にconsole.log（this.value、 "ネットワーク要求"）;
}
</ SCRIPT>
前記防振機能パッケージ
関数デバウンス（）{//だけ防振機能戻り、デバウンス機能を呼び出します
timerIdの= nullをしましょう。
復帰機能（）{
timerIdの&&てclearTimeout（れるtimerId）;
timerIdが=のsetTimeout（関数（）{
console.log（値、「ネットワーク要求」）。
}、1000）。
}
}
oInput.oninput =デバウンス（）。
24.JavaScript-スロットル機能
1.スロットル（スロットル）の機能は何ですか？
スロットル関数の最適化は、高周波JSコードを実行するための手段であります
機能の数を減らすことができ、高周波を実行するために呼び出します
効果を絞る2.機能
ウェブサイトのパフォーマンスを向上させ、コード実行の数を減らします
3.シナリオ機能の調整
oninput /れるonmousemove / onscroll /さらにonResizeやその他のイベント
前記差分画像安定化機能及び絞り機能
機能を絞ること（わずか3〜4回行うことができる、例えば10回連続呼び出し）高周波連続動作機能の実行時間を短縮することです
画像安定化機能は一度だけ実行される高周波動作の連続関数である場合、そのように（例えば、10の連続した呼び出しは一度だけ実行されます）