关于系统前端开发的那些事_html/css_WEB-ITnose
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了关于系统前端开发的那些事_html/css_WEB-ITnose，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4491字，纯文字阅读大概需要7分钟。
内容图文
引言：最近本人有幸参与公司3.0新版超市前端开发工作，开发工作中遇到一些问题，现将开发前端中遇到的一些问题和建议给大家伙做个分享^_^ 总结的不是很多，还有待完善，欢迎补充……
问题1：开发前端有时会遇到标签中的src属性值为空，或者src属性值存在，但是服务器端得图片被干掉了，这样就会导致2种影响页面执行的问题的诞生，
（1）、值为空的情况，导致了页面的重新加载，所有的请求被重新执行一次，大大降低页面加载速度；
（2）、此图片因为服务器的误操作等原因导致了图片丢失，浏览器F12查看图片Url后显示图片Url加载失败，浏览器报错，严重的话直接阻塞了UI线程；
对于以上2种情况，个人的建议是在调用图片的地方加上空值判断和默认图展示，标签可以加上onerror属性重新定位到加载失败后的默认图片，使用onerror的时候如果指定的默认图也丢失的话，
浏览器会循环查找指定路径的默认图，直到找到该默认图为止，可以使用以下代码段来阻止onerror属性的循环<img src='https://www.gxlcms.com/XX.jpg' onerror='this.onerror='';this.src='morentu.jpg''>,也可以JS设置this.onerror属性为null。
问题2：对于页面上的金钱符号处理，一般大多采用 ¥ 符号来做渲染，但是目前发现的问题是，采用¥符号，在一些低版本内核的浏览器中会出现兼容问题（显示不全、不显示），此情况出现的频率不是很高
建议对于页面上金钱符号的处理，可以采用字符编码或者特殊符号的形式展示,防止浏览器兼容带来的影响。
使用 ￥ 2.css设置字体属性 font-family:Arial; 或者在网页使用 ¥ 符号, 个人还是推荐用第二种方式显示，为什么？请看看JD、taobao。
问题3：对于页面中事件的监听和绑定，一般都是采用html代码与Js代码分离的方式，但是也不排除在html标签中直接绑定事件的现象，这样的做法看似确实方便了许多，但是随之也会带来一些问题
（1）、Js负责行为层，而html负责结构层，将2者混合在一块不符合前端架构设计思想；
（2）、Js写在内部不利于后期的维护，增加维护成本，无法进行迭代开发和功能扩展；
（3）、过多的Js操作写在Html结构中，会阻碍DOM树的加载，影响用户体验；
（4）、外部Js更方便压缩，合并请求和减少带宽的占用（按照规范编写）。
相比Js写在html中，外部Js仅仅是需要建立多次Htpp连接，优化http首部困难，但是对于压缩后所带来性能上的提升是利大于弊的。
------------------------------------------------------------------------------------------------------------------------------我是华丽的分割线-------------------------------------------------------------------------------------------------------------------------------------------------------
接下来在扯一扯webapi的那些事吧 ￣□￣｜｜
最近在用webapi的时候，通过单元测试调试webapi后发现不少问题，现做以下汇总和解决方案分享：
1.webapi有4种资源调度方式分别对应着数据库的CURD,自动匹配所有的GetXXX或者PostXXX的函数
webapi调度 数据库操作
GetAsync--------->select
PostAsync-------->Insert
PutAsync---------->Update
DeleteAsync------->Delete
说下post和put区别吧：项目中用post和put方式调度，其实都能实现同样的功能，但是put后返回的结果是单条的，而post返回的结果是多条的，结合到数据库的执行update和add后
返回的受影响行数，应该就很容易理解了吧； 8-|
2.如果创建人的api项目是2.0的话，默认自带的一些高版本的dll版本（系列化等）会引发程序在Gload.cs的异常，版本匹配不上，
这个不多说，本人已遇到，解决方式就是更换低版本的dll引用，dll文件统一管理咯；
3.大家在做post提交请求的时候，遇到需要传参的时候，参数较多会封装成实体，那么参数较少的情况可能就会挨个传参（不走url），看似没有问题,建立连接后会出现未将对象引用问题，
经调试发现虽然api通道能走通，但是参数获取未nul，检查地址发现没问题后还是获取null，取网上找了下，发现官方建议在传参时在前面打上【Frombody】标记就可以了，这样就会告诉
api要从请求体重获取data数据（只能存在一个【Frombody】）,加上后就可以继续玩耍了-。-；
Ps:[Frombody]如果按照键值的形式传参会获取不到值，所以清空data数据中的键只传value就可以啦（具体为什么还没想清楚，有了解的童鞋望告知*.*）；
4.项目中post基本上可以代替增删改操作了，默认访问Put、Delete调度会出现状态值为405的异常，如果需要用到PutAsync、DeleteAsync的童鞋需要在配置文件中加上这一段：
或者移除IIS中的ＷebDAV Publishing服务即可。
参考链接：
http://www.dotblogs.com.tw/mantou1201/archive/2013/10/14/124074.aspx --api学习
http://www.liaodihen.com/Article/20140513061934963362.html --Frombody解释
http://www.dotblogs.com.tw/mantou1201/archive/2013/10/14/124074.aspx --WebDav服务移除
如有不对或缺少，请补充！ 8-|
2015年12月05日补充：
1.鉴于之前说到对图片的手动处理方式，今天在组项目的时候，发现还不是很完美，目前也没想到更好的办法，出现的问题是项目需求问题，如果调用了onerror属性后，图片在加载失败的条件下触发了这个事件，但是如果需要用
浏览器的F12查看原先加载失败的url地址就没法查看了（src被重写），所以这个方法还是根据项目的实际情况使用吧。
内容总结
以上是互联网集市为您收集整理的关于系统前端开发的那些事_html/css_WEB-ITnose全部内容，希望文章能够帮你解决关于系统前端开发的那些事_html/css_WEB-ITnose所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。