>웹 프론트엔드 >JS 튜토리얼 >JavaScript 연산 클래스 및 스타일 code_javascript 기술에 대한 자세한 설명

JavaScript 연산 클래스 및 스타일 code_javascript 기술에 대한 자세한 설명

WBOY
WBOY원래의
2016-05-16 15:15:461197검색

더 이상 고민하지 않고, 구체적인 코드는 다음과 같습니다.

<!doctype html>
<html>
<head>
<meta charset="utf-">
<title>无标题文档</title>
<style>
.fontSize
{
font-size:px;
}
.fontWeight
{
font-weight:bold;
}
</style>
</head>
<body>
<div id="div" class="fontSize fontWeight" style="color:red">div实例文本</div>
<button onclick="changeStyle()">changeStyle()</button>
<script>
function changeStyle()
{
var div = document.getElementById("div");
//div.className = "fontSize";
//div.className += " fontWeight";
//删除单个class=""样式
//div.className = div.className.replace(/fontSize/,"");
//删除所有class=""样式
//div.removeAttribute("class");
//删除中的单个样式
div.style.cssText = div.style.cssText.replace(/red/,"blue");
//删除中的所有样式
//div.style.cssText = "";
}
</script>
</body>
</html>

위 내용은 JavaScript 연산 클래스와 스타일 코드에 대한 자세한 설명이므로 모든 분들께 도움이 되기를 바랍니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.