この記事では、衝突を決定するJSの方法について説明します。参照のためにそれを共有してください。詳細は次のとおりです。
JS判断衝突方法：
次のようにコードをコピーします：/**衝突しているかどうかを判断します
* @param objオリジナルオブジェクト
* @param dobjターゲットオブジェクト
*/
関数インパクト（OBJ、DOBJ）{
var o = {
X：getDefaultStyle（obj、 'left'）、
Y：getDefaultStyle（obj、 'top'）、
W：getDefaultStyle（obj、 'width'）、
H：getDefaultStyle（obj、 'height'）
}
var d = {
X：getDefaultStyle（dobj、 'left'）、
Y：getDefaultStyle（dobj、 'top'）、
W：getDefaultStyle（dobj、 'width'）、
H：getDefaultStyle（dobj、 'height'）
}
var px、py;
px = ox <= dx？ DX：OX;
py = oy <= dy？ dy：oy;
//ポイントが両方のオブジェクトにあるかどうかを決定します
if（px> = ox && px <= ox + ow && py> = oy && py <= oy + oh && px> = dx && px <= dx + dw && py> = dy && py <= dy + dh）{
trueを返します。
} それ以外 {
falseを返します。
}
}
/**オブジェクトプロパティを取得します
* @param objオブジェクト
* @param属性属性
*/
関数getDefaultStyle（OBJ、属性）{
return parseint（obj.currentstyle？obj.currentstyle [属性]：document.defaultview.getComputedStyle（obj、false）[属性]）;
}
例は次のとおりです。
コードを次のようにコピーします。<
<html>
<head>
<title> demo </title>
<style type = "text/css">
ボディ{マージン：0px;}
.main {position：relative;}
＃f1 {position：absolute;背景：＃ff0000;トップ：100px;左：100px;幅：200px;高さ：200px; z-index：999}
＃f2 {position：absolute;背景：＃ffff00;上：0px;左：0px;幅：600px;高さ：150px;}
</style>
</head>
<body>
<div>
<div id = "f1"> </div>
<div id = "f2"> </div>
</div>
<script type = "text/javascript">
var o = document.getElementById（ "f1"）;
var d = document.getElementById（ "f2"）;
アラート（衝撃（o、d））;
関数インパクト（OBJ、DOBJ）{
var o = {
X：getDefaultStyle（obj、 'left'）、
Y：getDefaultStyle（obj、 'top'）、
W：getDefaultStyle（obj、 'width'）、
H：getDefaultStyle（obj、 'height'）
}
var d = {
X：getDefaultStyle（dobj、 'left'）、
Y：getDefaultStyle（dobj、 'top'）、
W：getDefaultStyle（dobj、 'width'）、
H：getDefaultStyle（dobj、 'height'）
}
var px、py;
px = ox <= dx？ DX：OX;
py = oy <= dy？ dy：oy;
//ポイントが両方のオブジェクトにあるかどうかを決定します
if（px> = ox && px <= ox + ow && py> = oy && py <= oy + oh && px> = dx && px <= dx + dw && py> = dy && py <= dy + dh）{
trueを返します。
} それ以外 {
falseを返します。
}
}
関数getDefaultStyle（OBJ、属性）{
return parseint（obj.currentstyle？obj.currentstyle [属性]：document.defaultview.getComputedStyle（obj、false）[属性]）;
}
</script>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。