<div class="codetitle"> <span><a style="CURSOR: pointer" data="57143" class="copybut" id="copybut57143" onclick="doCopy('code57143')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code57143"> <br><script type="text/javascript"> <br> //<![CDATA[ <BR>function $(obj) <BR>{ <BR>return document.getElementById(obj) <BR>} <BR>function getStyle(obj,styleName) <BR>{ <BR>if(obj.currentStyle) //for ies <BR>{ <BR>return obj.currentStyle[styleName] //획득 방법에 주의<BR>} <BR>else //그 외 <BR>{ <BR>return document.defaultView.getCompulatedStyle(obj,null).getPropertyValue(styleName); <BR>//return document.defaultView.getCompulatedStyle(obj,null)[styleName] <BR>} <BR>$ ('btnGetClick').onclick=function() <BR>{ <BR>//태그에 직접 쓴 스타일은 인라인 스타일, 헤드 스타일에 쓴 스타일은 내부 스타일 , 링크에서 소개하는 스타일은 외부 스타일입니다<BR>//내장 스타일은 Dom.style을 통해 얻을 수 있습니다. 스타일 이름은 카멜 케이스 형식입니다<BR>//내부 스타일입니다. 스타일을 통해 외부 스타일을 얻을 수 없습니다. <BR>을 얻으려면 스타일 이름을 currentStyle ||로 전달해야 합니다. //사실 스타일이 포함되면 태그에 스타일 속성( 속성 값은 객체 객체를 반환합니다. 그러면 style.style 이름을 통해 얻을 수 있습니다. 🎜>//내부 또는 외부인 경우 스타일 속성이 있어도 해당 값은 비어 있으므로 가져올 수만 있습니다. currentStyle을 통해 || getCompulatedStyle <BR>//alert($('div2').style); 팝업 결과가 객체임을 알 수 있습니다. 이는 스타일이 존재하지만 그 아래에 해당 스타일 설정이 있음을 의미합니다. 비어 있습니다. <BR>$('testContent').innerHTML=''; <BR>var str=$('div').style.styleFloat || $('div').style.cssFloat; 따라서 더 이상 style.float를 사용할 수 없지만 ies:styleFloat, ff:cssFloat <BR>str=str ($('div').style.width '<br />'); =str ($('div2').style.width ' <br />'); //이 섹션은 내부 스타일을 얻을 수 없으며 null 값을 표시하지만 스타일이 존재하지 않는다는 의미는 아닙니다.<br>str=str ($('div2').width ' <br />'); //div2의 dom에 width 속성이 설정되지 않았기 때문에 정의되지 않은 값을 반환합니다.<br>str=str getStyle($( 'div2'),'width '); //div2의 스타일은 내부 스타일을 통해 제공되므로 currentStyle을 통해 가져옵니다 || getCompulatedStyle <br>$('testContent').innerHTML=str; 🎜>$('btnUpdateClick').onclick=function() <br>{ <br>//내장형이든 외부형이든 스타일을 설정할 때 어쨌든 다음에서 스타일 속성(객체)을 얻을 수 있습니다. 세 가지 방법 <br>//그렇습니다. 요소의 스타일을 설정하는 데 사용하세요. 스타일을 설정하는 방법에는 세 가지가 있습니다. <br>$('div').style.width='200px' <br>$('div2 ').style.width='100px' ; <br>$('div').style.cssText='ground:blue;color:red;font-weight:bold;'; //원래 정의를 덮어씁니다. 이는 style="Background:blue; Font-size:red;font-weight:bold;" <br>$('div2').className='testClassName'을 정의하는 것과 같습니다. //<div 클래스 설정과 동일합니다. ="testClassName" /> <br>} <br>//]]> <br></script> <br><br><br>데모 코드: <br><br><br> </div> <br> <br> <div class="htmlarea"> McJeremy&Xu의 테스트 <textarea id="runcode98218"> <title> </title> <meta name="generator" content="editplus"> <meta name="author" content=""> <meta name="keywords" content="">1부<meta name="description" content=""> <style type="text/css"> #div2 { width:200px; height:100px; margin-left:120px; border:1px dashed blue; } .testClassName { background:red; } </style>2부 <div id="div" style="width:100px;height:100px;border:1px solid red;float:left;"> </div>가치 확보<div id="div2"> </div>값 설정<div id="testContent"> </div> <button id="btnGetClick"> </button> <button id="btnUpdateClick"></button> </textarea>[Ctrl A 모두 선택 참고: <br>외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다 <input onclick="runEx('runcode98218')" type="button" value="运行代码">]<input onclick="doCopy('runcode98218')" type="button" value="复制代码"> </div>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
