javascript/jquery知识点记录(1)
2016-03-16 14:07
666 查看
1、window.top 与 window.self 与window.parent:
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口,
opener是用open方法打开当前窗口的那个窗口。
window.parent:
返回父窗口。
注:如果窗口本身是顶层窗口,parent属性返回的是对自身的引用。
在框架网页中,一般父窗口就是顶层窗口,但如果框架中还有框架,父窗口和顶层窗口就不一定相同了。
window.top:
返回顶层窗口,即浏览器窗口。
注:如果窗口本身就是顶层窗口,top属性返回的是对自身的引用。
window.self:
是对当前窗口自身的引用。它和window属性是等价的。
注:window、self、window.self是等价的。
2、使用jquery 怎么获取div的实际高度?
1. $("#div_id").height(); // 获得的是该div本身的高度, (不包含padding,margin,border)
2. $("#div_id").outerHeight(); // 包含该div本身的高度, padding上下的高度, 以及border上下的高度(不包含margin的高度)
3. $("#div_id").outerHeight(true); // 包含该div本身的高度, 以及padding,border,margin上下的总高度
jquery找兄弟节点:
$('#id').siblings() 当前元素所有的兄弟节点
$('#id').prev() 当前元素前一个兄弟节点
$('#id').prevaAll() 当前元素之前所有的兄弟节点
$('#id').next() 当前元素之后第一个兄弟节点
$('#id').nextAll() 当前元素之后所有的兄弟节点
这三个方法都可以添加选择器,给出选择条件,就能找到你指定的兄弟节点了。
parent() 当前子元素向上遍历单一层级; 取得一个包含着所有匹配元素的唯一父元素的元素集合。
parents() 和 .parent() 方法类似,不同的是后者沿 DOM 树向上遍历单一层级。 则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。
children(); 返回匹配元素集合中每个元素的子元素
3.js,jquery对json数组的操作:比如现在保存一个材料列表的数据,json的数据格式是:
增加和修改数据:
上面的删除,只是将json数组中的这个id所在的位置的一组数据删除了,但是该位置上的数据为null了,保存后发现该位置上数据为null
3、js jquery获取select框被选中的值:
jquery获取select被选中的value:
4、html禁止页面缓存:
5、判断input file选择的值是不是空?
6、/*禁用页面的右键菜单和文本选中*/
$(function () {
$(document).bind("selectstart", function () {
return false;
});
$(document).bind("dragstart", function () {
return false;
});
});
7、关于input file的一些知识:
1)input file选择相同的文件 不会触发onchange事件;
把input file的value值清空,再选择文件会触发onchange事件;
2)js
获取input file的值:
document.getElementById("inputFile_1").value
获取选择的文件大小:
document.getElementById("inputFile_1").files[0].size;
jquery获取input file的值:
3)如何清空input file 的值呢?
function delete_inputfile_value(id){
var file = document.getElementById("inputFile_"+id);
if(file.outerHTML){ // for IE, Opera, Safari, Chrome
file.outerHTML = file.outerHTML;
}else{ // FF(包括3.5)
file.value = "";
}
console.log(file.value);
}
但是上面的console.log打印出来还是原来的值。需要研究下outerHTML是怎么清掉的;
此时再选择文件 可以触发onchange事件。
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口,
opener是用open方法打开当前窗口的那个窗口。
window.parent:
返回父窗口。
注:如果窗口本身是顶层窗口,parent属性返回的是对自身的引用。
在框架网页中,一般父窗口就是顶层窗口,但如果框架中还有框架,父窗口和顶层窗口就不一定相同了。
window.top:
返回顶层窗口,即浏览器窗口。
注:如果窗口本身就是顶层窗口,top属性返回的是对自身的引用。
window.self:
是对当前窗口自身的引用。它和window属性是等价的。
注:window、self、window.self是等价的。
2、使用jquery 怎么获取div的实际高度?
1. $("#div_id").height(); // 获得的是该div本身的高度, (不包含padding,margin,border)
2. $("#div_id").outerHeight(); // 包含该div本身的高度, padding上下的高度, 以及border上下的高度(不包含margin的高度)
3. $("#div_id").outerHeight(true); // 包含该div本身的高度, 以及padding,border,margin上下的总高度
jquery找兄弟节点:
$('#id').siblings() 当前元素所有的兄弟节点
$('#id').prev() 当前元素前一个兄弟节点
$('#id').prevaAll() 当前元素之前所有的兄弟节点
$('#id').next() 当前元素之后第一个兄弟节点
$('#id').nextAll() 当前元素之后所有的兄弟节点
这三个方法都可以添加选择器,给出选择条件,就能找到你指定的兄弟节点了。
parent() 当前子元素向上遍历单一层级; 取得一个包含着所有匹配元素的唯一父元素的元素集合。
parents() 和 .parent() 方法类似,不同的是后者沿 DOM 树向上遍历单一层级。 则是取得一个包含着所有匹配元素的祖先元素的元素集合(不包含根元素)。可以通过一个可选的表达式进行筛选。
children(); 返回匹配元素集合中每个元素的子元素
3.js,jquery对json数组的操作:比如现在保存一个材料列表的数据,json的数据格式是:
<span style="font-size:10px;">var file_kxcl = [ { "id":"12", "mody_id":null, "file_type":"dsrsfzm", "file_name": "a.txt", }, { "id":"13", "mody_id":null, "file_type":"dsrsfzm", "file_name": "b.txt", }, { "id":"14", "mody_id":"", "file_type":"sqzxs", "file_name": "c.txt", } ]</span>怎么动态的生成这样一个json数组呢?
增加和修改数据:
function save_filelist(id, modyid, file_type, filename){ if(file_kxcl.length==0){ //为空,新增条目 file_kxcl[file_kxcl.length]= { "id":id, "modyid":modyid, "file_type":file_type, "file_name":filename } }else{ var exist = false; //记录数据列表是否存在某条数据 $.each(file_kxcl, function(n, value){ if(value!=null){ if(value.id == id){ //已经存在该条目,覆盖 value.modyid = modyid; value.file_type = file_type; value.file_name = filename; exist = true; return false; } } }); if(exist==false){ file_kxcl[file_kxcl.length]= //不存在该条目,新增 { "id":id, "modyid":modyid, "file_type":file_type, "file_name":filename } } } }删除一组数据:
function delete_filelist(id){ //必选材料列表 if(file_bxcl.length){ $.each(file_bxcl, function(n, value){ if(value!=null && value.id == id){ delete file_bxcl ; return false; } }); } console.log(file_bxcl); localStorage.setItem("file_bxcl_list", JSON.stringify(file_bxcl)); //必选材料 }
上面的删除,只是将json数组中的这个id所在的位置的一组数据删除了,但是该位置上的数据为null了,保存后发现该位置上数据为null
3、js jquery获取select框被选中的值:
jquery获取select被选中的value:
"<option value="6" selected="selected">abc</option>" //该项被选中 $("#xxx").val(); //获取select的value值 "<option value=\"7\" "+("7"==""+value.file_type+""?"selected":"")+">营业执照</option>" //判断该选项要不要被选中
4、html禁止页面缓存:
<meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache,must-ridate"> <meta http-equiv="expires" content="0">
5、判断input file选择的值是不是空?
<input type="file" name="uploadfile" id="input_file"> js: if(document.getElementById("input_file").value == "") jquery: if($("#input_file").val() == "")
6、/*禁用页面的右键菜单和文本选中*/
$(function () {
$(document).bind("selectstart", function () {
return false;
});
$(document).bind("dragstart", function () {
return false;
});
});
7、关于input file的一些知识:
1)input file选择相同的文件 不会触发onchange事件;
把input file的value值清空,再选择文件会触发onchange事件;
2)js
获取input file的值:
document.getElementById("inputFile_1").value
获取选择的文件大小:
document.getElementById("inputFile_1").files[0].size;
jquery获取input file的值:
$("#input_file").val() //这里得到的就是file的值,即上传 路径
3)如何清空input file 的值呢?
function delete_inputfile_value(id){
var file = document.getElementById("inputFile_"+id);
if(file.outerHTML){ // for IE, Opera, Safari, Chrome
file.outerHTML = file.outerHTML;
}else{ // FF(包括3.5)
file.value = "";
}
console.log(file.value);
}
但是上面的console.log打印出来还是原来的值。需要研究下outerHTML是怎么清掉的;
此时再选择文件 可以触发onchange事件。
相关文章推荐
- js jquery版本的 金额千分位转换函数(非正则,效率极高)
- JQuery 节点
- jQuery里$(this)和this的区别在哪?
- 【深入浅出jQuery】源码浅析--整体架构
- 导航栏项目滑过时子菜单显示/隐藏jquery代码
- jQuery的event.target
- jquery validate --转载
- jquery validate 对隐藏的元素不进行验证
- 微信视频开发jquery mobile
- jquery 中获取所有选中的checkbox的用法
- 基于jQuery Tipso插件实现消息提示框特效
- 简单的jQuery表单正则验证和提交
- Jquery技巧(必须掌握)
- JQUERY 插件开发——LAZYLOADIMG(预加载和延迟加载图片)
- Jquery轮播图片
- 精心挑选的12款优秀 jQuery Ajax 分页插件和教程
- jQuery插件开发的模式和结构
- Struts2+JQuery+Json实例
- jQuery插件开发精品教程,让你的jQuery提升一个台阶
- 锋利的JQuery 学习笔记