本文实例讲述了JS实现碰撞检测的方法。分享给大家供大家参考，具体如下：
一个简单的碰撞检测例子，检测div1是否和div2发生碰撞，当div1碰到div2时，改变div2的颜色，看测试图
看一下分析图：
当div1在div2的上边线(t2)以上的区域活动时，始终碰不上
当div1在div2的右边线(r2)以右的区域活动时,始终碰不上
当div1在div2的下边线(b2)以下的区域活动时,始终碰不上
当div1在div2的左边线(r2)以左的区域活动时,始终碰不上
除了以上四种情况，其他情况表示div1和div2碰上了，下面试完整测试代码
HTML部分：
<div id="div1"></div>
<div id="div2"></div>css部分：
<style>
#div1{
width:100px ;height: 100px;background: green;
position: absolute;
}
#div2{
width:100px ;height: 100px;background: yellow;
position: absolute;left: 300px;top: 200px;z-index: -1;
}
</style>JS部分：
<script>
window.onload = function () {
var oDiv = document.getElementById('div1');
var oDiv2 = document.getElementById('div2');
var disX = 0;
var disY = 0;
oDiv.onmousedown = function (ev) {
var ev = ev|| window.event;
disX = ev.clientX - oDiv.offsetLeft;
disY = ev.clientY - oDiv.offsetTop;
document.onmousemove = function (ev) {
var ev = ev|| window.event;
var t1 = oDiv.offsetTop;
var l1 = oDiv.offsetLeft;
var r1 = oDiv.offsetLeft + oDiv.offsetWidth;
var b1 = oDiv.offsetTop + oDiv.offsetHeight;
var t2 = oDiv2.offsetTop;
var l2 = oDiv2.offsetLeft;
var r2 = oDiv2.offsetLeft + oDiv2.offsetWidth;
var b2 = oDiv2.offsetTop + oDiv2.offsetHeight;
if(b1<t2 || l1>r2 || t1>b2 || r1<l2){// 表示没碰上
}else{
oDiv2.style.background = 'blue';
}
oDiv.style.left = ev.clientX - disX +'px';
oDiv.style.top = ev.clientY - disY +'px';
}
document.onmouseup = function () {
document.onmousemove = null;
document.onmouseup = null;
}
return false;
}
}
</script>前端常用60余种工具方法
邮箱,是否url地址,是否Symbol函数,是否Promise对象,是否Set对象,是否是微信浏览器,是否是爬虫,动态引入js,根据url地址下载
String 常用方法汇总
charAt()返回在指定位置的字符。charCodeAt()返回在指定的位置的字符的 Unicode 编码。concat()连接两个或更多字符串，并返回新的字符串。indexOf()返回某个指定的字符串值在字符串中首次出现的位置。
Array数组的常用方法汇
concat()连接两个或更多的数组，并返回结果。every()检测数值元素的每个元素是否都符合条件。filter()检测数值元素，并返回符合条件所有元素的数组。
Number 常用方法汇总
toExponential()把对象的值转换为指数计数法。toFixed()把数字转换为字符串，并对小数点指定位数。toLocaleString()把数字转换为字符串，使用本地数字格式顺序。
Javascript中 toFixed
简单来说就是：四舍六入五考虑，五后非零就进一，五后为零看奇偶，五前为偶应舍去，五前为奇要进一。但是不论引入toFixed解决浮点数计算精度缺失的问题也好，它有没有使用银行家舍入法也罢，都是为了解决精度的问题
Javascript有重写吗？
JavaScript中有重写。有时子类并不想原封不动地继承父类的方法，而是想作一定的修改，这就需要采用方法的重写。方法重写又称方法覆盖。
javascript中的split方法怎么用？
split()方法可以利用字符串的子字符串的作为分隔符将字符串分割为字符串数组，并返回此数组，本文给大家介绍javascript split 方法。split() 方法用于把一个字符串分割成字符串数组。
JavaScript中Array.find()方法如何使用？
find()方法返回通过测试（函数内判断）的数组的第一个元素的值。当数组中的元素在测试条件时返回 true 时, find()返回符合条件的元素，之后的值不会再调用执行函数。如果没有符合条件的元素返回undefined。
自定义Buffer方法
Buffer类，是用来创建一个专门存放二进制数据的缓存区。每当需要处理二进制数据时，就有可能使用到Buffer类。Buffer存在于全局对象上，是必须要了解和掌握的知识。
javascript中怎么定义静态方法？
JavaScript中直接定义在构造函数上的方法和属性是静态的, 定义在构造函数的原型和实例上的方法和属性是非静态的。