本文详细解析HTML中a标签的href与onclick事件的执行顺序及相互影响。重点说明onclick返回false可阻止跳转，推荐href使用javascript:void(0)避免页面跳动。同时指出IE6等旧版浏览器中通过href访问parentNode的兼容性问题，以及javascript协议可能导致的动画停止和事件触发异常，提供实际代码示例与解决方案。
a标签href与onclick执行顺序及常见陷阱解析
关于onclick事件中javascript的行为差异，通常在使用频率不高时容易被忽视，但一旦出现故障往往令人困扰。以下对这一机制进行具体解释。
此前对此类写法较为随意，后来观察到.NET框架中的LinkButton控件常采用<a href="javascript:fun();"...>的形式。今日尝试使用此种方式时遇到了一些问题，现将网友的分析文章及本人的结论整理如下。
1. 链接的 onclick 事件会优先执行，随后才会执行 href 属性定义的动作（即页面跳转或执行 javascript 伪链接）； 2. 若链接中同时包含 href 与 onclick，且希望阻止 href 定义的跳转动作，必须在 onclick 处理函数中返回 false。可以注释掉 goGoogle 函数中的 return false 语句进行验证； 3. 若页面内容较长存在滚动条，且希望仅通过链接的 onclick 事件执行操作，应将 href 属性设置为 javascript:void(0);，避免使用 #，以防止页面发生不必要的滚动跳动； 4. 若在链接的 href 属性中调用一个具有返回值的函数，当前页面的内容将被该函数的返回值所替换； 5. 在按住 Shift 键点击时，行为会有所不同； 6. 本次遇到的问题：在 IE6.0 浏览器中，通过 href 形式无法访问到 parentNode 属性； 7. 建议尽量避免使用 javascript: 协议作为 A 标签的 href 属性，这不仅会不必要地触发 window.onbeforeunload 事件，在 IE 浏览器中还会导致 GIF 动画图片停止播放。 以上即为相关总结，为此耗费了不少时间。
[背景] 在使用 CheckBoxList 控件时，希望实现在每个 checkbox 后添加链接的功能。点击链接时，除了执行特定功能外，还需要将对应的 checkbox 设为选中状态。
<input type="checkbox" name="chk" id="chk"> <label for="chk">选中它<a onclick="this.parentNode.click();" href="#" style="border:solid 1px blue;">[label中的链接]</a></label>
最终通过 parentNode 属性实现了该功能。
<a href="javascript:void(0)" onclick="defineField(this);return false">ClickToDefine</a>