zoukankan      html  css  js  c++  java
  • jQuery 属性操作

    1 css操作

    2 文本操作

    3 属性操作

    4 位置

    5 尺寸


    1、css操作

    addClass();// 添加指定的CSS类名。
    removeClass();// 移除指定的CSS类名。
    hasClass();// 判断样式存不存在
    toggleClass();// 切换CSS类名,如果有就移除,如果没有就添加。
    
    css("color","red")//DOM操作:tag.style.color="red"
    $("p").css("color", "red"); //将所有p标签的字体设置为红色

    2、文本操作

    //HTML代码:
    html()// 取得第一个匹配元素的html内容
    html(val)// 设置所有匹配元素的html内容
    //文本值:
    text()// 取得所有匹配元素的内容
    text(val)// 设置所有匹配元素的内容
    //值:
    val()// 取得第一个匹配元素的当前值
    val(val)// 设置所有匹配元素的值
    val([val1, val2])// 设置checkbox、select的值

    3、属性操作

    //用于ID等或自定义属性
    attr(attrName)// 返回第一个匹配元素的属性值
    attr(attrName, attrValue)// 为所有匹配元素设置一个属性值
    attr({k1: v1, k2:v2})// 为所有匹配元素设置多个属性值
    removeAttr()// 从每一个匹配的元素中删除一个属性
    
    //用于checkbox和radio
    prop() // 获取属性
    removeProp() // 移除属性
    因兼容性,checkbox和radio尽量使用特定的prop(),不要使用attr("checked", "checked")
    
    <input type="checkbox" value="1">
    <input type="radio" value="2">
    <script>
      $(":checkbox[value='1']").prop("checked", true); 
      $(":radio[value='2']").prop("checked", true);
    </script>

    4、位置

    offset([coordinates]) //offset方法的参照物是可视窗口
    position()  //参照物是定位的父亲标签
    scrollTop([val])// 获取匹配元素相对滚动条顶部的偏移。
    scrollLeft([val])// 获取匹配元素相对滚动条左侧的偏移。
    .offset()方法允许我们检索一个元素相对于文档(document)的当前位置。
    和 .position()的差别在于: .position()是相对于相对于父级元素的位移。

    5、尺寸

    height([val|fn])// 取得匹配元素当前计算的高度值(px)
    width([val|fn])// 取得第一个匹配元素当前计算的宽度值(px)
    innerHeight()//获取第一个匹配元素内部区域高度(包括补白、不包括边框)。
    innerWidth()//获取第一个匹配元素内部区域宽度(包括补白、不包括边框)
    outerHeight([options])// 获取第一个匹配元素外部高度(默认包括补白和边框)
    outerWidth([options])// 获取第一个匹配元素外部宽度(默认包括补白和边框)
  • 相关阅读:
    【bzoj2653】【middle】【主席树+二分答案】
    Codeforces 464E. The Classic Problem
    关于主席树的入门,讲解和题单
    BZOJ3531-[Sdoi2014]旅行(树剖+线段树动态开点)
    [bzoj3123][洛谷P3302] [SDOI2013]森林(树上主席树+启发式合并)
    1018_两个圆相交的面积
    String对象中常用的方法
    张爱玲写的信
    React Native拆包及热更新方案 · Solartisan
    vue项目实战
  • 原文地址:https://www.cnblogs.com/snailgirl/p/9139450.html
Copyright © 2011-2022 走看看