jQuery的简单笔记

html css javaScript Ajax jQuery Java servlet jsp jdbc mysql oracle
struts spring hibernate jdpm tomcat jUnit Ant Hadoop linux unix
android sql server

jQuery的简单笔记
//使用JQuery输出
    /*
     * jquery对象:需要用"$"来修饰
     *
     * jquery获取页面标签:$()来包裹,通过"#id"来获取
     *
     */
 //dom转化为JQUery对象  $(DOM对象)
  var username = document.getElementById("username");
 
  var $username = $(username);
 
  alert($username.val());
<script language="JavaScript">
   //JQUERY对象转化为DOM对象
   
   //方法一:jquery对象是一个数组对象,获取利用索引值进行转换成DOM对象
   var $username = $("#username");
   
//   var username = $username[0];
//   
//   alert(username.value);
   
   //方法二:在jquery中,提供了一个get(index)方法,get()中传入索引值,来进行转换成DOM对象
   
   var username = $username.get(0);
   
   alert(username.value);
   
   /*
    * DOM对象与Jquery对象可以相互转换
    *         * Jquery对象不能使用DOM对象的属性和方法
    *         * DOM对象不能使用jquery对象的属性和方法
    */
       
  </script>

<script language="JavaScript">
        //<input type="button" value="改变 id 为 one 的元素的背景色为 #0000FF"  id="b1"/>
        //document.getElementById("b1").onclick = function(){}
        $("#b1").click(function(){
            /*
             * css(name,value)
             *         * 改变标签的样式
             *         * name:属性名称,对应要到css帮助文档中查找对应的名称
             *         * value:属性的值
             */
            $("#one").css("background","#0000FF");
        });
        
        
        //<input type="button" value=" 改变元素名为 <div> 的所有元素的背景色为 #00FFFF"  id="b2"/>
        $("#b2").click(function(){
            $("div").css("background","#00FFFF");
        });
        
        //<input type="button" value=" 改变 class 为 mini 的所有元素的背景色为 #FF0033"  id="b3"/>
        $("#b3").click(function(){
            $(".mini").css("background","#FF0033");
        });
        
        //<input type="button" value=" 改变所有元素的背景色为 #00FF33"  id="b4"/>
        $("#b4").click(function(){
            $("*").css("background","#00FF33");
        });
        
        //<input type="button" value=" 改变所有的<span>元素和 id 为 two 的元素的背景色为 #3399FF"  id="b5"/>
        $("#b5").click(function(){
            //多个选择器并列使用,用","隔开
            $("span,#two").css("background","#3399FF");
        });

</script>

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。