zoukankan      html  css  js  c++  java
  • jquery中节点的操作以及一些其他方法的操作

    Jquery中节点操作

    1.   创建节点:

    $(‘html字符串’): 如$(‘<p>hello jquery</p>’);

    2.   添加节点:

    append  ,  appendTo  添加到元素内容的最后面

        $('.father').append($('p'));
        $('h2').appendTo($('.father'));

    prepend ,  prependTo  添加到元素内容的最前面

       $('.father').prepend($('p'));
        $('h2').prependTo($('.father'));

    before -- -> $A.before($B)  将B扔到A的前面(兄弟关系,相邻)

        $('.son').before($('.son2'));

    after-- -> $A.after($B)  将B扔到A的后面(相邻,兄弟关系)

        $('.son').after($('.son2'));

    3.   删除节点

    Remove()自杀型

    4.   清除节点

    Empty()清空所有内容

    5.   克隆节点

    Clone(参数) [都是深拷贝]

    False:默认值,克隆结构,不克隆事件

    True: 克隆结构,也克隆事件

    $(‘p’).clone(true)

    6.   其他的一些方法:

    Val() 获取和设置value值

    Html()设置或获取html值,相当于innerHtml

    Text()设置和获取text文本值,相当于innerText

    获取盒子的宽高

    Width/height  ----------- content

    innerWidth/innerheight -------content + padding

    outerwidth/ outerheight --------content +padding + border

    outerwidth(true)/outerheight(true) -----content + padding + border + margin

    滚动事件中获取设置以及实现animate动画的方法---scrollTop

    1.    获取页面卷曲的高度

    $(window).scrollTop()

    底层js的实现则是通过

    Var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop

    2.    设置页面卷曲的高度

    $(window).scrollTop(值)

    底层js的实现; document.documentElement.scrollTop(值)

    pageYOffset 是只读属性,不能用于设置操作

    3.    实现animate动画时,需要给html设置

    $('html').animate({ scrollTop: 0 });

    Offset()获取的是距离整个document页面左顶点的距离

    返回值是个对象:如 {left:200,top:200}

    Position()获取的是距离最近的有定位的祖辈元素的距离

    返回值是个对象: 如{left:200,top:200}

  • 相关阅读:
    HDU 2544 最短路
    Codeforces Round #588 (Div. 2) D. Marcin and Training Camp
    Codeforces Round #590 (Div. 3) B2. Social Network (hard version)
    Codeforces Round #585 (Div. 2) B. The Number of Products
    MongoDB基本概念
    MongoDB基本命令
    MongoDB常见问题
    MongoDB副本集
    Zookeeper Java 客户端
    MongoDB安装
  • 原文地址:https://www.cnblogs.com/z-lin/p/11106150.html
Copyright © 2011-2022 走看看