javascript笔记——工作笔记
1、防止普通用户缓存静态文件,每次修改之后给静态文件的应用后面加上参数后缀[项目文件较多时最好使用前端构建工具]
比如:
<script src="$!webPath/resources/js/orderPayInfo.js?ver=2" type="text/javascript"></script>
但是这种做法也有弊端,即浏览器给这种缓存方式的缓存容量太少了,只有12Mb,且不分Host。所以更极致的做法是以文件名为Key,文件内容为value,缓存在localStorage里,命中则从缓存中取,不命中则去服务器取,虽然缓存容量也只有5Mb,但是每个Host是独享这5Mb的。
2、微信支付和快捷支付那一块,需要轮询服务器订单的状态,当状态发生改变时需要做相应的跳转动作, 此时的请求需要加时间戳,因为相同的请求操作会被缓存下来,也就是会缓存本地的已有的数据,如果不加时间戳程序会使用本地缓存的数据
url:contextPath+'/pingan/pay/quick/orderPayTotalStatus.htm?'+(new Date()).getTime(),
3、小的逻辑块可能重复使用,此时最好都封装进小的函数中,方便以后使用
4、iframe的弊端太多,谨慎使用
5、localStorage 和 sessionStorage 使用 本地存储和本地会话存储很有用
6、留意同步请求和异步请求,当需要拿到请求的数据使用时,需要写成同步请求:比如
function checkOpenAccNo(){
var len = true;
jQuery.ajax({
type: "POST",
async:false,
url: contextPath+"/pingan/pay/quick/listopencards.htm",
dataType: "text",
success:function(data){
data = jQuery.parseJSON(data);
var cards=data.data.accNos;
if(!cards.length){
len = false;
}
},
error:function(e){
}
});
return len
}
6、git/recource tree 命令
$ git stash
$ git log
$ git stash pop
以上这几个命令经常一起用。
7、获取当前域名
window.location.host
document.domain
例如:
document.domain
"www.baidu.com"
window.location.host
"www.baidu.com"
8、获取当前页面地址
document.referrer //如果当前文档不是通过超级链接访问的,则为 null。这个属性允许客户端 JavaScript 访问 HTTP 引用头部。
window.location.href
例如:
window.location.href
"https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=0&rsv_idx=1&tn=baidu&wd=%E6%90%…UuFGh4gfDqIX10zvw&rqlang=cn&rsv_enter=1&rsv_sug3=8&rsv_sug1=9&rsv_sug7=100"
document.referrer
""
9、取消当前文档的选中
document.onselectstart = function () { return false; }
8、站长统计
var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cspan id='cnzz_stat_icon_1259954722'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s11.cnzz.com/z_stat.php%3Fid%3D1259954722%26show%3Dpic1' type='text/javascript'%3E%3C/script%3E"));
9、seo 中的网站验证
<meta name="baidu-site-verification" content="IUSTUHWIjp" />
10、type=“file”的click事件
两种实现方式
<div class="add-img">
+
</div>
<input type="file" name="myfile"> $('.add-img').click(function(){
$(this).next('input[name="myfile"]').trigger('click');
})
$('.add-img').click(function(){
var that =this;
setTimeout(function(){
$(that).find('input[name="myfile"]').trigger('click');
},0)
})
<div class="add-img">
+
</div>
<input type="file" name="myfile">
//从这种解决方式可以看到 文档结构中input type="file" 拿到点击对象的外面就不会出现一直触发回调的情况了 【你写在后面应该是不会出现这个情况的,父子关系,trigger一直触发这个回调】
11、当后台返回一个查询结果的view界面就不能使用正常的ajax请求得到的数据然后再展示数据

12、js代码
//搜索订单信息
jQuery('#search-order').click(function(){
var orderId = jQuery(this).parent().find('input').val();
jQuery(this).attr('href',contextPath+'/buyer/order.htm?order_id='+orderId);
})
//后台返回的数据有重复的 去重
//我的足迹去重
var result = [];
#foreach($listCase in $footPointList)
var goodsCase = jQuery.parseJSON('$listCase.fp_goods_content');
for(var i=0;i<goodsCase.length;i++){
result.push(goodsCase[i])
}
#end
function uniqu(){
var itemList = [];
var ssjson = {};
for(var j=0;j<result.length;j++){
var item = result[j];
if(!ssjson[item.goods_id]){
itemList.push(result[j])
ssjson[item.goods_id] = 1;
}
}
return itemList
}
var res = uniqu();
jQuery.each(res,function(i,item){
var imgUrl = item.goods_img_path;
var goodsUrl = '$!webPath/goods_'+item.goods_id+'.htm';
var goodsName = item.goods_name;
var goodsPrice =item.goods_price;
var html ='<ul class="rbox_ul">' +
'<li class="rbox_ul_img">' +
'<a href="'+goodsUrl+'" target="_blank">'+
'<span class="img_cspan">'+
'<p><img src="'+imgUrl+'" width="190" height="190"></p>'+
'</span>'+
'</a>'+
'</li>'+
'<li class="rbox_ul_name">'+
'<a href="'+goodsUrl+'" target="_blank">'+goodsName+'</a>'+
'</li>'+
//'<li class="rbox_ul_evaluate">(已有0人评价)</li>'+
'<li class="rbox_ul_price">¥'+goodsPrice+'</li>'+
'</ul>';
jQuery('#fp').append(html)
})
13、//使用百度静态资源库注意写上回退机制,保不准哪天别人的资源库宕机了,代码如下
<script type="text/javascript" src="//apps.bdimg.com/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
(function(){
window.jQuery || document.write('<script src="$!webPath/resources/js/jquery-1.6.2.js"><\/script>');
})();
</script>
javascript笔记——工作笔记的更多相关文章
- javascript - 工作笔记 (事件四)
在javascript - 工作笔记 (事件绑定二)篇中,我将事件的方法做了简单的包装, JavaScript Code 12345 yx.bind(item, "click&quo ...
- JavaScript语言精粹笔记
JavaScript语言精粹笔记 掌握语言的每个特性可以让你出风头,但是并不推荐,因为一部分的特性带来的麻烦可能远超本身的价值.正如书中所言,坏的材料并不能雕刻出好的作品,要成为一名更好的程序员,要取 ...
- 2016年第2周读书笔记与工作笔记 scrollIntoView()与datalist元素
这一周主要是看了html5网页开发实例与javascript 高级程序设计,供以后翻阅查找. html5网页开发实例第1章与第二章的2.1部分: 第1章内容: html5在w3c的发展史. 浏览器的 ...
- 工作笔记5.JAVA图片验证码
本文主要内容为:利用JAVA图片制作验证码. 设计思路: 1.拷贝AuthImageServlet.class图片验证码 2.配置web.xml 3.JSP中,调用封装好的AuthImageServl ...
- 《工作笔记:移动web页面前端开发总结》
工作笔记:移动web页面前端开发总结 移动web在当今的发展速度是一日千里,作为移动领域的门外汉,在这段时间的接触后,发现前端开发这一块做一个小小的总结. 1.四大浏览器内核 1.Trident (I ...
- 工作笔记3.手把手教你搭建SSH(struts2+hibernate+spring)环境
上文中我们介绍<工作笔记2.软件开发经常使用工具> 从今天開始本文将教大家怎样进行开发?本文以搭建SSH(struts2+hibernate+spring)框架为例,共分为3步: 1)3个 ...
- JavaScript看书笔记01
JavaScript看书笔记... ------------------- JavaScript允许var定义语句出现在函数内部的任意位置.JS中使用Var来显示的给变量声明 JavaScript是一 ...
- JavaScript正则表达式学习笔记(二) - 打怪升级
本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...
- 《你不知道的javascript》读书笔记2
概述 放假读完了<你不知道的javascript>上篇,学到了很多东西,记录下来,供以后开发时参考,相信对其他人也有用. 这篇笔记是这本书的下半部分,上半部分请见<你不知道的java ...
随机推荐
- 免费的天气预报API--谷歌,雅虎,中央气象台
Google Weather API 仅仅支持美国地区使用邮政编码进行查询,比如: http://www.google.com/ig/api?hl=zh-cn&weather=94043 ...
- 通过缓存数据库结果提高PHP性能(转)
众所周知,缓存数据库查询的结果可以显著缩短脚本执行时间,并最大限度地减少数据库服务器上的负载.如果要处理的数据基本上是静态的,则该技术将非常有效.这是因为对远程数据库的许多数据请求最终可以从本地缓存得 ...
- Metadata Lock原理1
https://www.percona.com/blog/2013/02/01/implications-of-metadata-locking-changes-in-mysql-5-5/ impli ...
- .net控件Control透明
public partial class tspControl : UserControl { public tspControl() { InitializeComponent(); SetStyl ...
- linux epoll模型
原文:http://yjtjh.blog.51cto.com/1060831/294119 Linux I/O多路复用技术在比较多的TCP网络服务器中有使用,即比较多的用到select函数.Linux ...
- HttpServer的使用
http://docs.oracle.com/javase/8/docs/jre/api/net/httpserver/spec/overview-summary.html 1.Package com ...
- Scala中的构造器
Scala中的构造器 Scala中的构造器分为两类,主构造器和辅助构造器 主构造器是通过类名后面跟的括号里加参数列表来定义 辅助构造器是通过关键字this定义 定义一个无参主构造器 class rec ...
- poj3295解题报告(构造、算术表达式运算)
POJ 3952,题目链接http://poj.org/problem?id=3295 题意: 输入由p.q.r.s.t.K.A.N.C.E共10个字母组成的逻辑表达式, 其中p.q.r.s.t的值为 ...
- Android(java)学习笔记117:英文朗诵android App编写实例
1.首先,我先把代码放到下面: package com.himi.speaker; import java.util.Locale; import android.app.Activity; impo ...
- CentOS(九)--与Linux文件和目录管理相关的一些重要命令①
接上一篇文章,实际生产过程中的目录管理一定要注意用户是root 还是其他用户. 一.目录与路径 1.相对路径与绝对路径 因为我们在Linux系统中,常常要涉及到目录的切换,所以我们必须要了解 & ...