jQuery常用方法

最新推荐文章于 2025-09-08 17:59:21 发布

转载最新推荐文章于 2025-09-08 17:59:21 发布 · 191 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/wjwap/p/10296547.html

文章标签：

#javascript #ViewUI

本文详细介绍了使用jQuery进行DOM操作的方法，包括元素的选择、内容和属性的获取与修改、样式的控制以及动画效果的实现。从基本的选择器到复杂的动画效果，全面覆盖了jQuery的核心功能。

$("#A")           /*id选择器*/
       $(".a")           /*class选择器*/
       $("div")       /*标签选择器*/
       $("[属性名='属性值']")
       $("input:checkbox[name='qwer']:checked")
       $("#asd").html();       /*获取全部内容*/
       $("#asd").html("asd");   /*改变全部内容*/
       $("#asd").text();       /*获取文本内容*/
       $("#asd").text("asd");   /*改变文本内容*/
       $("#zxc").val();       /*获取value值*/
       $("#zxc").val("123");   /*改变value值*/
       $("#asd").attr("bs","123");/*增加更改属性的值*/
       $("#asd").attr("class");/*获取属性的值*/
       $("#asd").removeAttr("class");/*删除属性的值*/
       $("#asd").css("width"); /*获取样式*/
       $("#asd").css("width","800px");    /*改变样式 */
       $("#asd").css("background-color","red"); /*书写方式和CSS一样*/
       $(".zxc").html("123");       /*全部赋值和改样式*/
       $(".zxc").css("display","none");
       var a = $(".zxc");           /*给第一个赋值*/
       var b = a.eq(0).html("123");
       $("#asd").hide();       /*隐藏*/
       $("#asd").show();       /*显示*/
                                                       /*部分动画效果*/
       function aaa(){
           $("#asd").fadeOut(2000);       /*淡出*/
       }
       function vvv(){
           $("#asd").fadeIn(2000);           /*淡入*/
       }
       function ccc(){
           $("#asd").fadeToggle(2000);       /*淡入淡出一个按钮控制*/
       }
       function aaa(){
           $("#asd").fadeTo(2000,0.4);       /*到多少透明度停止*/
       }


       function aaa(){
           $("#asd").slideDown();           /*下滑*/
       }
       function vvv(){
           $("#asd").slideUp();           /*上滑*/
       }
       function ccc(){
           $("#asd").slideToggle();        /*一个按钮控制滑动*/
       }


       function aaa(){
           $("#asd").animate({               /*变形动画*/
               "width":'250px',
               "height":'100px',
               "opacity":'0.3',
               "margin-left": "300px"
           });
       }
   </script>