Jquery 中，$(document).ready()是什么意思？和window.onload 的区别？ 还有其他什么写法或者替代方法？

$(document).ready()是指在页面中等到所有DOM准备就绪时，执行ready()这个函数，一般把jq事件和函数放置于该事件中。

区别：

• window.onload需要页面内包括图片等所有元素加载完毕后才能执行，而$(document).ready()是DOM结构绘制完毕后就可以执行，不必等到加载完毕。
• window.onload不能同时编写多个，如果页面有多个window.onload,只会执行最后一个，$(document).ready()可以同时编写多个并执行

其他写法：

• $(document).ready(function)
• $().ready(function)
• $(function)

---

$node.html()和$node.text()的区别

• $node.html()获取被选元素的节点包括html结构
• $node.text()获取被选元素的文本节点

---

$.extend 的作用和用法?

1. 当我们提供两个或多个对象给$.extend()，对象的所有属性都添加到目标对象（第一个参数）并返回，如果没有{}将赋值到第一个对象。
   用法为：
   var object=$.extend({},object1,object2);

2. 当一个参数为true时，将会进行递归的深拷贝合并。
   用法为：
   var object=$.extend(true,{},object1,object2);

---

JQuery 的链式调用是什么？

指的是在JQ环境下，函数的返回对象可以连续的使用.jq()的方法进行连续调用而不报错

---

JQuery ajax 中缓存怎样控制?

使用cache这个参数控制，true代表可以缓存，false则为不缓存？（不缓存的方法主要是运用是时间戳的原理）

---

jquery 中 data 函数的作用

data函数主要是用来在元素中存放临时数据
如：

$("div").data("loading",'hahha');
  console.log($("div").data("loading"));  //"hahha"

---

代码

1. 给元素 $node 添加 class active，给元素 $noed 删除 class active
   $node.addClass('active) //添加
$node.removeClass('active') //删除

2. 展示元素$node, 隐藏元素$node
   $node.show() //展示
$node.hide() //隐藏

3. 获取元素$node 的 属性: id、src、title， 修改以上属性
   $node.attr('id/src/title','el') //只有第一个参数代表获取元素属性，第二个可选参数el为需要设置的属性

4. 给$node 添加自定义属性data-src
   $node.attr('data-src','添加的属性')

5. 在$ct 内部最开头添加元素$node
   $ct.prepend($node)

6. 在$ct 内部最末尾添加元素$node
   $ct.append($node)

7. 删除$node
   $node.remove() //删除此元素以及子元素

8. 把$ct里内容清空
   $ct.empty() //删除ct子元素

9. 在$ct 里设置 html <div class="btn"></div>
$ct.html('<div class="btn"></div>')

10. 获取、设置$node的宽度、高度(分别不包括内边距、包括内边距、包括边框、包括外边距)

    获取高度：
    $node.height()        返回高度（不包括内边距、边框或外边距）
    $node.inndrHeight()    返回高度包括内边距
    $node.outerHeight()     返回高度包括内边距和边框
    $node.outerHeight()    返回高度包括内边距边框和外边距
    //宽度等同于上边
    设置宽高例子：
    `$('div').width(300).height(200);  设置div宽度300，高度200`
    

11. 获取窗口滚动条垂直滚动距离
    $(document).scrollTop();

12. 获取$node 到根节点水平、垂直偏移距离
    $node.offset()

13. 修改$node 的样式，字体颜色设置红色，字体大小设置14px

    $node.css({
        "color":"red",
        "font-size":"14px"    
    }; 
    

14. 遍历节点，把每个节点里面的文本内容重复一遍

    $.each($node,function(){
      console.log($(this).text());
    });
    或：
    $node.each(function(){
      console.log($(this).text());
    });
    

15. 从$ct 里查找 class 为 .item的子元素
    $ct.find('item')

16. 获取$ct 里面的所有孩子
    $ct.children() //获取直接子元素
$ct.find('*') //获取所有后代元素

17. 对于$node，向上找到class为'.ct'的父亲，在从该父亲找到'.panel'的孩子
    $node.parents('.ct').find('.panel')

18. 获取选择元素的数量
    $node.length; //$node.size()

19. 获取当前元素在兄弟中的排行
    $node.index()

---

代码

代码2、3

---

• 本博客版权归羞涩的涩和饥人谷所有，转载请注明出处