javascript/jquery知识点记录(1)

来源：互联网发布：淘宝子账号如何登陆编辑：程序博客网时间：2024/06/06 09:20

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的数据格式是：

<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[n];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事件。

1 0