首页 > 解决方案 > 如何更改 CSS 和 JS 中的 CSS 样式表?

问题描述

function colorChanger() {
  var len = document.getElementById("string").value.length;
  if (len < 50) {
    style1.onclick = swapStyleSheet("first_50.css");
  } else if (len > 50 && len < 100) {
    style1.onclick = swapStyleSheet("second_100.css");
  }
}
function swapStyleSheet(sheet){
    document.getElementById('css_style').setAttribute('href', sheet);
}

less than 50这是我的代码,如果字符数是并且我希望它更改样式表more than 50 and less than 100

我的代码不起作用

标签: javascript

解决方案


这是我的代码,它正在更改样式表。

<html>

<head>
    <title>
        Change Css
    </title>
    <script lang="javascript">
        function colorChanger() {
            var len = document.getElementById("string").value.length;
            if (len < 50) {
                swapStyleSheet("first_50.css");
            } else if (len > 50 && len < 100) {
                swapStyleSheet("second_100.css");
            }
        }

        function swapStyleSheet(strName) {
            document.getElementById("cssChanger").href = strName;
        }
    </script>
    <link href="first_50.css" id="cssChanger" />
</head>

<body>
    <input type="text" id="string" value=""></input>
    <input type="button" id='style1' value="Change Css" onclick="javascritpt:colorChanger();">
</body>

</html> ````

推荐阅读