• JQUERY 操作


    对内容的操作   

      捕获  获得内容

                         text() - 设置或返回所选元素的文本内容
          html() - 设置或返回所选元素的内容(包括 HTML 标记)
          val() - 设置或返回表单字段的值

      设置  添加新内容

          text("新内容") - 设置所选元素的文本内容
          html("新内容") - 设置所选元素的内容(包括 HTML 标记)
          val("新内容") - 设置表单字段的值

          添加新内容的同时,通过回调函数,拿到旧的内容和当前元素的下标

    对元素的操作    

      添加元素    添加新的 HTML 内容     append() - 在被选元素的内部结尾插入内容  prepend() - 在被选元素的内部开头插入内容  after() - 在被选元素外部之后插入内容  before() - 在被选元素外部之前插入内容

                          $(".cun3").append("<div class ='shouji'><img src='"+dom+"'/></div>");

      删除元素  remove() - 删除被选元素(及其子元素)     empty() - 从被选元素中删除其子元素

            比如$("p").empty()和$("p").html(""),都是把<p>abcd</p>中的文本移除,留下 了<p></p>,仍保留其在dom中所占的位置

          但是html("")会造成内存泄漏,empty()会释放内存,感兴趣的朋友可以用html(""),empty("")分别测试,用chrome的任务管理器检测内存使用。

            $("p").remove()则是把其从dom中删除,什么都不留,既不会保留其所占的位置。 

    属性操作  

      获取属性  attr() 方法用于获取属性值。  $("button").click(function(){alert($("#runoob").attr("href"));});    

            对于 HTML 元素本身就带有的固有属性,在处理时,使用 prop 方法。

     

            对于 HTML 元素我们自己自定义的 DOM 属性,在处理时,使用 attr 方法

             添加新属性的同时,通过回调函数,拿到旧的属性和当前元素的下边

      删除属性   

         removeAttr()  从所有匹配的元素中移除指定的属性。$("img").removeAttr("src");

    class类的操作 

      addClass()  向匹配的元素添加指定的类名。
      hasClass()  检查匹配的元素是否拥有指定的类。

      removeClass()  从所有匹配的元素中删除全部或者指定的类。
      toggleClass()  从匹配的元素中添加或删除一个类。

         addClass(“className”)方法是用来给指定元素增加类名,也就是说给指定的元素追加样式;
    .               removeClass(“className”)方法是用来给指定的元素移除类名,也就是说给指定元素移除样式;
                   .toggleClass(“className”)方法是用来给脂定的元素增加或移除类名(如果元素的类名存在就移除,如果不存在就增加),也就是说用来给指定的元素进行样式切换(如果元素存在样式则去掉,如果不存在则加上样式)。**

     

          例子

            $("selector").toggleClass("className");
                               等同于
                               if($("selector").hasClass("className")){
                                   $(this).removeClass("className");
                               } else {
                                 $(this).addClass("className");
                             }
                            也等同于
                          $("selector").hasClass('className') ? $("selector").removeClass('className') : $("selector").addClass('className');

    尺寸  height()设置或返回元素的高度(不包括内边距、边框或外边距)     width()设置或返回元素的宽度(不包括内边距、边框或外边距)

           $("#box").height("500px").width("500px"); 

        innerHeight()获取第一个匹配元素内部区域高度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效。
        nnerWidth()获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效
        outerHeight([options]) 获取第一个匹配元素外部高度(默认包括补白和边框)。此方法对可见和隐藏元素均有效。 options设置为 true 时,计算边距在内。
        outerWidth([options])获取第一个匹配元素外部宽度(默认包括补白和边框)。此方法对可见和隐藏元素均有效。options设置为 true 时,计算边距在内。

    css操作

      设置样式   单个样式 $("p").css("background-color","yellow");    多个样式$("p").css({"background-color":"yellow","font-size":"200%"});

      offset([coordinates])  获取匹配元素在当前视口的相对偏移。返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。

      position()  获取匹配元素相对父元素的偏移。返回的对象包含两个整型属性:top 和 left。为精确计算结果,请在补白、边框和填充属性上使用像素单位。此方法只对可见元素有效。

      scrollTop([val])获取匹配元素相对滚动条顶部的偏移。此方法对可见和隐藏元素均有效。val设定垂直滚动条值 设置相对滚动条顶部的偏移

      scrollLeft([val])获取匹配元素相对滚动条左侧的偏移。此方法对可见和隐藏元素均有效。val设定水平滚动条值 设置相对滚动条左侧的偏移

      innerHeight()获取第一个匹配元素内部区域高度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效。

      innerWidth()获取第一个匹配元素内部区域宽度(包括补白、不包括边框)。此方法对可见和隐藏元素均有效

       

     

     

  • 相关阅读:
    [转]Asp.Net MVC EF各版本区别
    web攻击之七:常见CDN回源问题总结
    web攻击之六:DNS攻击原理与防范
    web攻击之四:DOS攻击
    web攻击之五:上传漏洞
    web攻击之三:SQL注入攻击的种类和防范手段
    web攻击之二:CSRF跨站域请求伪造
    TCP洪水攻击(SYN Flood)的诊断和处理
    DDoS攻防战(三):ip黑白名单防火墙frdev的原理与实现
    DDoS攻防战(二):CC攻击工具实现与防御理论--删除
  • 原文地址:https://www.cnblogs.com/zqy6666/p/11872468.html
Copyright © 2020-2023  润新知