개발일지/JavaScript + jquery

[jquery] 변수명을 설정해서 쉽게 부르기(feat.alert)

연습용365 2021. 9. 14. 00:08 
<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script src="../jquery-3.6.0.min.js"></script>
  <style>
	#div1{ width:200px; height:100px; font-size:20px; background:orange; }
  </style>
  <script>
	$(function(){

	});
  </script>
 </head>
 <body>
	<div id="div1">고양이</div>
 </body>
</html>


이런 파일을 준비한다.
그럼 아래처럼 뜰 것이다.

 

  <script>
		$(function(){
			var div1 = $('#div1');
			alert(div1.width());
			alert(div1.height());
			alert(div1.css('font-size'));
	});
  </script>


var div1 = $('#div1');
변수명 = 선택자

alert(div1.width());
경고창에 div1의 width 크기를 띄운다.


이런식으로..

alert창에 div1의 width, height, font-size 값이 차례대로 뜬다.