jQuery 中， $(document).ready()是什么意思？
$(document).ready()的作用是当文档中的DOM节点加载完成后，在加载外部图片和资源前，执行ready()里面的操作。(注意：$(document).ready(function(){})可以简写成$(function(){}))
如果执行的代码需要在元素被加载之后才能使用时，（例如，取得图片的大小需要在图片被加载完后才能知道），就需要将这样的代码放到 load 事件中。
window.onload是整个页面加载完成（包括图片，css，脚本等）之后再执行onload()中的操作。并且 window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个 （后者会覆盖前者）。
$node.html()和$node.text()的区别?
$node.html()：获取 $node元素的HTML内容，包括HTML标签和文本
$node.text()：获取 $node元素的文本内容，不包括HTML标签
$.extend 的作用和用法?
将两个或更多对象的内容合并到第一个对象。
在默认情况下，通过$.extend()合并操作不是递归的；
如果第一个对象的属性本身是一个对象或数组，那么它将完全用第二个对象相同的key重写一个属性,这些值不会被合并。
如果将 true 作为该函数的第一个参数，那么会在对象(只是对象)上进行递归的合并。
var obj1 = {
name : zoro,
number: {a:17,b:18}
}
var obj2 =
number: {a:20,c:21}
color: green
}
$.extend(obj1,obj2)
//obj1 { name:zoro, number:{a:20,c:21},color:green}
obj1 = {
name : zoro,
number: {a:17,b:18}
}
$extend(true,obj1,obj2)
//obj1 {name:zoro,number:{a:20,b:18,c:21},color:green}
jQuery 的链式调用是什么？
$('#id').css('color','pink').find('p').text()
jQuery进行的每一步操作最终返回的都是一个jQuery对象。
链式操作能大大精简代码量。
使用链式操作，所有操作代码共享一个jQuery对象，省去了逐步查询DOM元素的性能损耗。
jQuery 中 data 函数的作用
.data() 方法允许我们在DOM元素上绑定任意类型的数据,避免了循环引用的内存泄漏风险。
.data(key,value);
以指定的键名key存取数据。如果指定了value参数，则表示以键名key存放值为value的数据；如果没有指定value参数，则表示读取之前以键名key存放的数据；如果没有指定任何参数，则以对象形式返回之前存储的所有数据
data(obj);
以对象形式同时传入任意多个key-value形式的数据，对象的每个属性就是键名key，属性值就是value。
data()函数的所有"存储数据"操作针对当前jQuery对象所匹配的每一个元素；所有"读取数据"操作只针对第一个匹配的元素
即当使用.data()获取值时，jQuery会首先尝试将获取的字符串值转化成JS类型，包括布尔值，null，数字，对象，数组
如果就是想获取字符串值而不想获得自动转换的值，可以使用.attr(“data-”+key)来获取相应的值
写出以下功能对应的 jQuery 方法：
给元素 $node 添加 class active，给元素 $noed 删除 class active
$node.addClass('active') $node.removeClass('active')
展示元素$node, 隐藏元素$node
$node.hide() $node.show()
获取元素$node 的 属性: id、src、title， 修改以上属性
$node.attr('id') $node.attr('src') $node.attr('title')
$node.attr({id: 'zoro', src: 'http:asd', title: 'real'})
给$node 添加自定义属性data-src
$node.data('data-src','url')
在$ct 内部最开头添加元素$node
$ct.prepend($node)
在$ct 内部最末尾添加元素$node
$cd.append($node)
删除$node
$node.remove()
把$ct里内容清空
$ct.empty()
在$ct 里设置 html <div class="btn"></div>
$ct.html('<div class="btn"></div> ')
获取、设置$node 的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)
设置参数则设置获取的属性 $node.height('700')
$node.height() 不包括内边距 仅是内容的高度
$node.width() 不包括内边距 仅是内容的宽度
$node.innerHeight() 获取padding+内容的高度
$node.innerWidth() 获取padding+内容的宽度
$node.outerHeight() 获取边框+padding+内容的高度
$node.outerWidth() 获取边框+padding+内容的宽度
$node.outerHeight(true) 获取外边距+边框+padding+内容的高度
$node.outerWidth(true) 获取外边距+边框+padding+内容的宽度
获取窗口滚动条垂直滚动距离
$(window).scrollTop() 垂直滚动距离
$(window).scrollLeft() 水平滚动距离
获取$node 到根节点水平、垂直偏移距离
$node.offset().left 水平偏移距离
$node.offset().top 垂直偏移距离
修改$node 的样式，字体颜色设置红色，字体大小设置14px
$node.css({'font-size':'14px', 'color':'red'})
遍历节点，把每个节点里面的文本内容重复一遍
$node.each(function(){
console.log($(this).text())
})
从$ct 里查找 class 为 .item的子元素
$ct.find('.item')
获取$ct 里面的所有孩子
$ct.children()
对于$node，向上找到 class 为'.ct'的父亲，在从该父亲找到'.panel'的孩子
$node.parents('.ct').find('.panel')
获取选择元素的数量
$node.length
获取当前元素在兄弟中的排行
$node.index()
网友评论