Comment changer la feuille de style CSS en CSS et JS?
Dec 02 2020
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);
}
Ceci est mon code, je veux qu'il change la feuille de style si le nombre de caractères est less than 50etmore than 50 and less than 100
Mon code ne fonctionne pas
Réponses
3 RamSaini Dec 02 2020 at 14:11
Ceci est mon code, il change la feuille de style.
<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> ````
2 Md.RafiulIslamShohan Dec 02 2020 at 13:37
function changeCSS(cssFile, cssLinkIndex) {
var oldlink = document.getElementsByTagName("link").item(cssLinkIndex);
var newlink = document.createElement("link");
newlink.setAttribute("rel", "stylesheet");
newlink.setAttribute("type", "text/css");
newlink.setAttribute("href", cssFile);
document.getElementsByTagName("head").item(0).replaceChild(newlink, oldlink);
}
function colorChanger() {
var len = document.getElementById("string").value.length;
if (len < 50) {
changeCSS("first_50.css",index); // index is head tag child element index ex:0
} else if (len > 50 && len < 100) {
changeCSS("second_100.css",index);// index is head tag child element index ex:0
}
}
1 H4CKTRIK Dec 02 2020 at 14:09
Ok, je l'ai compris, je n'ai pas besoin d'échanger des feuilles de style entières, donc de devoir recharger le css dans le DOM, je peux simplement utiliser element.classList.remove ('good-tier')