js對屬性的操做

 

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            .a{
                color: red;
                font-size: 30px;
            }
            p.active{
                color: blue;
            }
        </style>
    </head>
    <body>
        <p title="小馬過河" id="p1" class="a">18歲</p>
        <script type="text/javascript">

            // 若是是自定義的屬性,要在文檔上能看到,經過setAttribute設置屬性
            var p1 = document.getElementById('p1');
            console.log(p1.getAttribute('title'));
            console.log(p1.getAttribute('class'));
            // p1.setAttribute('class','abc');
            // p1.setAttribute('adadad','1321313');

            // console.log(p1.className);
            // console.log(p1.title);
            // p1.abc = 123;
            // console.dir(p1);
            // p1.onclick = function(){
            //     this.className = this.className +' active';
            // }

        </script>
    </body>
</html>

 

1.1javascript

            var p1 = document.getElementById('p1');
            console.log(p1.getAttribute('title'));
            console.log(p1.getAttribute('class'));

 

獲取屬性值  選取的對象.get屬性() :      p1.getAttribute('title') 

 

1.二、css

// 若是是自定義的屬性,要在文檔上能看到,經過setAttribute設置屬性
var p1 = document.getElementById('p1');

p1.setAttribute('class','abc');
p1.setAttribute('adadad','1321313');
console.log(p1.getAttribute('class'));
console.log(p1.getAttribute('adadad'));

對象. set屬性(‘鍵’,‘值’)  能夠修改已有屬性,能夠設置未設置屬性,能夠自定義屬性         p1.setAttribute('class','abc');html

1.三、java

            var p1 = document.getElementById('p1');
        console.log(p1.getAttribute('class'));
            p1.class='mcw'
            p1.aaa='bbb'
            console.log(p1.getAttribute('class'));
            console.log(p1.getAttribute('aaa'));
            console.log(p1.class);
            console.log(p1.aaa);

 對象.屬性設置的屬性不能用get屬性得到,用對象.屬性得到this

而且元素行裏不顯示設置的屬性spa

 

1.四、增長屬性值。(好比添加多個類名)3d

            p1.onclick = function(){
                this.className = this.className +' active'; 
            }

 點擊一下就添加了類屬性值,也能夠用+=實現code

相關文章
相關標籤/搜索