二、属性值

1.获取、改变属性值

//设置样式值,获取和改变在标签里写的值,css中无效
            var ds= $("#ds").first();
            console.log(ds.attr("type"));
            
            ds.attr("value","ssss");

 

2.设置innerHtml和innerText

//设置innerHtml和innerText
            var dd = $("#dd");
            dd.html("ss<br />qq");
            dd.text("haha");

3.val()获取表单元素的当前值

//val()只能获取表单元素的当前值
            var ds = $("#ds");
            console.log(ds.val());

4.addClass追加一个class样式,不会覆盖,

//addClass追加一个class样式,不会覆盖
            var dd = $("#dd");
            dd.addClass("reds");
            
            //删除class
            dd.removeClass();

 5.切换样式

$("#table tr").addClass("all");
            
            $("table tr:odd").toggleClass("red");//偶数行切换class(如果有就删除,如果没有就增加)--此次增加
            
            $("table tr:odd").toggleClass("green");//偶数行切换class(此次增加)
            //(对于class重复定义相同属性,只执行后添加的新属性)
            
            $("table tr:even").toggleClass("all",false);//奇数行切换样式,有则不变,没有则添加,就是要最后是true(存在该样式)

6.css样式

//获取css样式,在本页定义的style或者引入的css文件皆可
            var width = $("#dd").css("width");
            $("p:eq(0)").text(width);//第一个p元素显示div的width
            
            $("p:eq(1)").text($("#dd").css("height"));
            //颜色都会转化成统一的rgb标示,如rgb(255, 192, 203)
            $("p:eq(2)").text($("#dd").css("background-color"));
            
            //同时获取多个属性值,存入数组
            var value = $("#dd").css(["width","height"]);
            alert(value.width+" "+value.height);
            
            //设置属性值
            $("#dd").css("background-color","greenyellow");
            
            //合并设置
            $("#dd").css({
                "height":"200px",
                "width":"100px"
            });
        
        });

7.css与addclass优先级

$("#dd").css("background-color","greenyellow");
            $("#dd").addClass("red");
            //通过.css方法设置的样式属性优先级要高于.addClass方法
            //addclass方法只会将新样式设置进去,而不会覆盖已设置的样式

8.data()和removeDate()

var $dd = $("#dd");
            //添加数据
            $dd.data("name","蔡文姬");
            $dd.data("detail",{
                age:"18",
                sex:"boy"
            })
            
            alert($dd.data("name"));
            alert($dd.data("detail").age);
            
            //删除数据
            $dd.removeData("name");
            alert($dd.data("name"));

 

posted @ 2018-04-12 15:26  菜鸡蔡文姬  阅读(206)  评论(0编辑  收藏  举报