在網頁開發中,使用JavaScript可以實現各種動態效果,同時也可以使用JavaScript動態添加CSS樣式。下面介紹一些使用JavaScript添加CSS樣式的方法。
//通過JavaScript添加CSS樣式 var style = document.createElement('style'); style.innerHTML = 'p{color: red;}'; document.head.appendChild(style);
上面這段代碼可以在頁面head標簽中動態添加樣式,這里以把p標簽的文字顏色設置為紅色為例。可以看到,使用JavaScript動態添加CSS樣式非常方便。
//通過JavaScript動態修改元素的class屬性 var ele = document.getElementById('test'); ele.className = 'new_class';
上面這段代碼可以通過修改元素的class屬性來添加CSS樣式,這里以修改id為test的元素的class屬性為new_class樣式為例。這種方法可以方便的通過JavaScript來修改元素的樣式
總結:利用JavaScript可以實現網頁樣式的動態效果,動態添加CSS樣式是很常見的操作之一,通過上述方法可以方便的實現。