使用时jquery先引进jquery文件包

<script src="jquery-1.11.2.min.js"></script>

一个页面有多个文件jquery要放在最前面

jquery
 $代表选择器
 
 JS
     选取元素
     操作内容
    操作属性
    操作样式

//页面加载完成事件 完成之后走function
$(document).ready(function(e) {
   
   //页面加载完成之后执行

 

  <div id="aa" style=""></div>
    <div class="aa">222</div>
    <span class="aa">333</span>
    <input type="text" name="uid" />
    <input type="checkbox" name="" />
 1 JS
 2         找元素 ,DOM对象
 3             document.getElementById("aa")
 4             
 5             document.getElementsByClassName("aa")
 6             alert(a[1])
 7             
 8             var a = document.getElementsByTagName("div");
 9              
10              var A  =  document.getElementsByName("uid");
操作内容
            a.innerHTML//操作元素里面的html代码
            a.innerTEXT//操作元素里面的文本
            
            a.value//操作白表单元素的值
            
           操作属性
           a.setAttribute("",""); //设置
        a.removeAttribute(""); //移除

        a.getAttribute(""); //获取
            
            //操作样式
            a.style.backgroudColor = "red";
    jquery
        找元素,jquery对象    
            var b = $("#aa")
            alert(b[0]);// 根据iD找    把jquer转成dom对象 加个索引[0]
            
            var b =$(".aa");
            alert(b[1]);//只要加索引找到的是dom对象
            alert(b.eq(0))//加eq找jquery 代表取第一个jquery对象
    
             var b  = $("div")//根据标签名找
            alert(b[0]);
            
            var b = $("[name = 'uid']");//根据属性找对象
            alert(b[0]);
            
            操作内容
                非表单元素
                alert b.html("<span style="color"></span>");//操作元素里面的HTML代码 
                b.text();//操作元素里面的文本
                
                表单元素
                b.val("hello");
                
                操作属性
                    设置属性
                    b.attr("bs","test");
                    
                    获取属性
                    alert(b.attr("aa"));
                    
                    移除属性
                    b.removeAttr("aa");
                    
                    b.prop("checked",true);//复选框单选,
                
                操作样式 jquer可以获取内嵌的样式
                b.css("background-color","#F00");
                alert(b.css("width"));//获取样式
                alert(b.css("background-color"));
                
                
                
});

 

posted on 2017-01-03 10:54  甘冬冬  阅读(218)  评论(0编辑  收藏  举报