JavaScript jQuery tips

最新推荐文章于 2021-08-06 15:52:11 发布

原创最新推荐文章于 2021-08-06 15:52:11 发布 · 172 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jQuery #JavaScript #IE #Ajax #框架 #ViewUI

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

本文探讨了JavaScript在不同浏览器中的兼容性问题解决方法，包括IE错误提示、jQuery操作DOM元素及框架间的正确交互方式等。同时介绍了jQuery判断DOM元素存在性的方法，以及在进行跨框架访问操作时的注意事项。

JS常用信息：

IE错误提示“缺少标识符、字符串或数字”，检查JS文件中对象字面量是否最后包含逗号。比如
```
var obj = {id: 1, name: 'test',};
```
紧接'test'后那个逗号就会导致IE出错。而FireFox正常。

jQuery操作下拉菜单选定某个项目功能在IE中似乎无效。兼容办法：

document.getElementById( id ).selectedIndex = $('#' + id + " option[value='" + someval + "']").attr('index');

jQuery判断DOM是否存在:

// 判断DOM元素是否存在
if ($('#id')[0] ) {
    do_fun();  // exists
}
if ($('#id').length > 0) {
    do_fun();
}

错误的框架访问：

$(window.top.document).find('#topFrame p').text();	
$(window.parent.document).find('#topFrame').remove();

正确的框架访问：

$(window.parent.frames['left'].document).empty(); //删除左框架“内容”

在顶级窗口中改变框架本身属性，此时的框架是顶级窗口的一个DOM 对象

$(window.parent.parent.document).find('#fs2').attr('cols', '155,*');
$(window.top.document).find('#left').remove();

以下是跨框架访问操作DOM 元素 . frames + id 的方式最兼容

window.top.document.getElementById('left').id;
window.top.frames[0].document.getElementById('SendFlag').id;
window.top.frames['topFrame'].document.getElementById('SendFlag').id;
window.top.frames['left'].document.getElementById('mli0').name;
$(window.top.frames['left'].document).find('#mli0').attr('id');
$(window.top.frames['topFrame'].document).find('p').text('cqple');
$('p', window.top.frames['topFrame'].document).text('cqple');

子窗口操作父窗口

// jquery
$("#父窗口元素ID",window.parent.document)...就行了
//js 版本
window.parent.document.getElementById()

jQuery 对象

var el = $(selector);  // 取到的el变量为jquery对象，el[0]则为 selector对象
var node = el.jquery ? el[0] : el; // el.jquery 返回真（其实是jquery版本号）说明el为jquery对象

jQuery ajax对提交值编码规则
如果是字符串类型不编码，如果是对象则默认调用encodeURIComponent。所以如果$ajax data参数值是自己拼接的字符串那么就需要手工编码一次

var pdata  = '&a=33' + '&b=' + encodeURIComponent('zz=3');
// var pdata  = {a: 33, b: 'zz=3', c: 'z3&?aj=3', d: encodeURIComponent('z3&?aj=3')};

$.ajax({
   type : "POST",
   url    : "some.php",
   data:  pdata
   success: function(msg){
     // do something
   }
});