js 給某個div增加class 樣式（三種方式）

本文轉載自查看原文 2018-11-30 10:59 4917 JS/ php/ html

第一種： el.setAttribute('class','abc');

  <!DOCTYPE HTML>
    <HTML>
    <HEAD>
    <meta charset="utf-8" />
    <title>setAttribute('class', 'abc')</title>
    <style type="text/css">
    .abc {
    background: red;
    }
    </style>
    </HEAD>
    <BODY>
    <div id="div">test div</div>
    <script>
    var div = document.getElementById('div');
    div.setAttribute("class", "abc");
    </script>
    </BODY>
    </HTML>

第二種： el.setAttribute('className', 'abc');

<!DOCTYPE HTML>
    <HTML>
    <HEAD>
    <meta charset="utf-8" />
    <title>setAttribute('className', 'abc')</title>
    <style type="text/css">
    .abc {
    background: red;
    }
    </style>
    </HEAD>
    <BODY>
    <div id="div">test div</div>
    <script>
    var div = document.getElementById('div');
    div.setAttribute("className", "abc");
    </script>
    </BODY>
    </HTML>

第三種：el.className = 'abc';

 <!DOCTYPE HTML>
    <HTML>
    <HEAD>
    <meta charset="utf-8" />
    <title>el.className = 'abc'</title>
    <style type="text/css">
    .abc {
    background: red;
    }
    </style>
    </HEAD>
    <BODY>
    <div id="div">test div</div>
    <script>
    var div = document.getElementById('div');
    div.className = 'abc';
    </script>
    </BODY>
    </HTML>

建議使用第三種方法，其他方法可能存在瀏覽器兼容問題。

原文：https://blog.csdn.net/yan791124465/article/details/71123664

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 反射：獲取Class對象的三種方式 css樣式表的三種方式 CSS 樣式穿透的三種方式 JS三種引入方式 JS函數的三種方式 Java Class類以及獲取Class實例的三種方式關於js修改三種css樣式的方法（反射）獲取類的Class文件的三種方式 JS綁定事件的三種方式三種方式解決你的js加載亂碼