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属性。
- 比如
<input type='button' class='demo' id='jsbtn' />
function showmessage(){ ··· 语句 ··· } //相应的处理时间在JavaScript里头添加: document.getElementById().onclick = showmessage;
- 比如
页面未加载完成不能被执行和使用。
以上就是关于“ javascript 代码分离 的那些事儿 ” 的全部内容。