javascript 代码分离 的那些事儿

javascript 代码分离 的那些事儿

注意： 我们时常都需要修改代码，因此，我们需要把代码调整为代码分离状态，并让它保持良好的代码分离状态。

核心概念 就是 保持行为层、内容层、表现层的分离。
这里仅把javascript当做性能增强的手段。

案例引入：

• 案例1： javascript 渐进增强 - type='button’改为type='submit’提交
• 案例2：参考如下代码：【本文演示案例】

  <input type='button' class='demo' onclick='showmessage()' style='color: #0099ff;' />
  

第一步：脱离HTML

也将会是最重要的一步：从页面标签里清除JavaScript代码onclick='showmessage()'。

第二步：把css样式信息转移到样式层

• 比如给html添加class属性，并封装到外部样式文件；

• 利用多种不同的选择符定义自己的样式规则，包括input元素或是利用id属性。

  1. 比如 <input type='button' class='demo' id='jsbtn' />

     function showmessage(){
     	··· 语句 ···
     }
     //相应的处理时间在JavaScript里头添加：
     document.getElementById().onclick = showmessage;
     

页面未加载完成不能被执行和使用。

---

以上就是关于“ javascript 代码分离 的那些事儿 ” 的全部内容。