我的jq笔记

记录用jq踩的坑

Posted by AllocatorXy on February 22, 2017

获取位置

这个和原生是反的

/* 到定位父级 */
$(selector).position().left 
$(selector).position().top

/* 绝对位置 */
$(selector).offset().left
$(selector).offset().top

获取尺寸

/* 原生 */
obj.offsetWidth
obj.offsetHeight

/* jQuery */
$(selector).width()       // 内容宽高,不包含border和padding
$(selector).height()

$(selector).innerWidth()  // 里侧宽高: 内容宽高 + padding
$(selector).innerHeight()

$(selector).outerWidth()  // 外侧宽高: 内容宽高 + padding + border
$(selector).outerHeight()

$(window).width()         // clientWidth
$(window).height()        // clientHeight

DOM操作

A.append(B);        // 在A里面追加B (后面)

A.prepend(B);       // 在A里面追加B (前面)

A.appendTo(B);      // 把A放到B里面 (后面)

A.prependTo(B);     // 把A放到B里面 (前面)

A.after(B);         // 在A外面追加B (后面)

A.before(B);        // 在A外面追加B (前面)

A.insertAfter(B);   // 把A放到B外面 (后面)

A.insertBefore(B);  // 把A放到B外面 (前面)

$('Element').remove('id/css/tag/嵌套/...'); // 删除匹配到的元素,若匹配为空则删除所有元素


////////////////////////////////////////////////////
// 注意这样删除的元素不会彻底删除,还会保存在jQuery对象中 //
////////////////////////////////////////////////////



小工具

$.browser.msie  // is that ie? false/true
$.trim(str)     // 去除首尾空格
$.type(sth)     // 测试类型
$(parent).find(selector)     // 匹配父元素中后代元素
$(parent).children(selector) // 匹配父元素的直接子元素