小編給大家分享一下js怎么使用setAttribute修改css樣式，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

成都創新互聯，專注為中小企業提供官網建設、營銷型網站制作、響應式網站設計、展示型成都做網站、成都網站建設等服務，幫助中小企業通過網站體現價值、有效益。幫助企業快速建站、解決網站建設與網站營銷推廣問題。

在JavaScript中，可以利用setAttribute()方法來通過類修改css樣式。

說明

1、setAttribute()方法添加指定的屬性，并為其賦指定的值。

2、如果這個指定的屬性已存在，則僅設置/更改值。

語法

element.setAttribute(attributename,attributevalue)

參數

attributename String 必需。您希望添加的屬性的名稱。

attributevalue String 必需。您希望添加的屬性值。

實例

    var testNode = document.getElementsByClassName("test")[0];
    var cssTextBtn = document.getElementsByClassName("cssText")[0];
    var attributeBtn = document.getElementsByClassName("setAttribute")[0];
    var stylesheetBtn = document.getElementsByClassName("stylesheet")[0];
    
    // 1. 修改style樣式:
    stylesheetBtn.addEventListener('click', function(e) {
        var stylesheet = document.styleSheets[0];
        stylesheet.cssRules[0].style.backgroundColor = "green";
    }, false);
    
    // 2. 修改特定元素節點的style內容
    cssTextBtn.addEventListener('click', function(e) {
        testNode.style.cssText = "width: 300px; background-color: red; height: 200px;"
        testNode.style.border = "1px solid black"
    }, true);
    
    // 3. 通過setAttribute 修改style屬性值
    attributeBtn.addEventListener('click', function(e) {
        testNode.setAttribute('style', 'width: 400px; background-color: yellow; height: 300px;')
    }, false)

以上是“js怎么使用setAttribute修改css樣式”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創新互聯行業資訊頻道！

當前標題：js怎么使用setAttribute修改css樣式
文章URL：http://vcdvsql.cn/article22/jhgjjc.html

成都網站建設公司_創新互聯，為您提供建站公司、定制網站、手機網站建設、云服務器、網站設計、定制開發

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯