obtrusive js v.s. unobtrusive js

obtrusive js:

<div onclick='alert("hihihi"); a = 1+1; c = 2*2; ' > some text here </div>
1. 难于查看（特别是多行代码）    ( hard to view the code)
2. 难于单元测试   ( hard to write unit test)
3. JS 跟ＨＴＭＬ 混在了一起。 ( mixed js with html... )

unobtrusive js: （含蓄ＪＳ）

<div class='alert_hi'>some text here</div>
<div class='alert_hi'> anotherr text ehrre.... </div>

<script>
$('.alert_hi').onclick = function (){ alert('hihihi') }
</script>

1. 解耦： ＪＳ 代码与ＨＴＭＬ代码  (decoupled js and html)
2. 方便单元测试。 (比如上面，直接对ＦＯＯ进行测试 ）  (easy to test)
3. 提高代码复用程度。  (easy to reuse)
4. 高手都这么用。 ( js gurus way)