with 블럭 사용하기

비타주리

· 3년 전 · 조회 2040 2040 · 댓글 17 17

http://www.mediaplayer.kr/main/bbs/html_editor.php

위 에디터에서 직접 확인하시면 더 좋습니다.

예를 들어서 하나의 div 등을 만들고 아이디를 하나 주고

엘레먼트의 형태가 바뀌는 아래의 이벤트를 주었습니다.

<div id=sir>그누보드</div>
<script>
sir.innerText = "비타주리";
sir.style.color = "#ff0000";
sir.style.padding = "10px";
sir.style.border = "1px solid #cccccc";
sir.style.borderRadius = "10px";
sir.style.textAlign = "center";
</script>

----------

이걸 with 블럭으로 감으면 코드가 상당히 매끈해 집니다.

<div id=sir>그누보드</div>
<script>
with (sir) {
   innerText = "비타주리";
   style.color = "#ff0000";
   style.padding = "10px";
   style.border = "1px solid #cccccc";
   style.borderRadius = "10px";
   style.textAlign = "center";
}
</script>

----------

아래처럼 사용해도 되겠지요.

with 블럭은 단순히 id 나 class 뿐만이 아니라 공통으로 엮인 부분은 모두 대상화 할 수 있습니다.

<div id=sir>그누보드</div>
<script>
sir.innerText = "비타주리";
with (sir.style) {
    color = "#ff0000";
    padding = "10px";
    border = "1px solid #cccccc";
    borderRadius = "10px";
    textAlign = "center";
}
</script>

----------

<div id=sir>그누보드</div>
<script>
with (sir) {
   innerText = "비타주리";
   with (style) {
       color = "#ff0000";
       padding = "10px";
       border = "1px solid #cccccc";
       borderRadius = "10px";
       textAlign = "center";
   }
}
</script>

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 17개

김창헌

번호	제목	글쓴이	조회	날짜
16329	node.js Node.js MongoDB 정렬	수다왕	2,606	6년 전
16328	node.js 정규 표현식으로 필터링	수다왕	2,374	6년 전
16327	node.js 환경설정 - dotenv	수다왕	2,515	6년 전
16326	node.js Node.js MongoDB 쿼리	수다왕	2,264	6년 전
16325	node.js node.js MongoDB Find - projection	수다왕	2,243	6년 전
16324	node.js nodejs MongoDB Find All	수다왕	2,707	6년 전
16323	node.js Node.js MongoDB find	수다왕	1,862	6년 전
16322	node.js node.js MongoDB _id Field	수다왕	1,994	6년 전
16321	node.js node.js MongoDB 여러 문서 삽입	수다왕	2,452	6년 전
16320	node.js Node.js MongoDB Insert	수다왕	2,244	6년 전
16319	node.js Node.js MongoDB 컬렉션 만들기	수다왕	2,313	6년 전
16318	node.js Node.js MongoDB 데이터베이스 생성	수다왕	2,134	6년 전
16317	node.js Node.js MongoDB 설치 1	수다왕	2,432	6년 전
16316	node.js Node.js 전자 메일 보내기	수다왕	2,240	6년 전
16315	node.js Node.js 파일 업로드	수다왕	2,676	6년 전
16310	node.js node.js 이벤트 모듈	수다왕	2,069	6년 전
16309	node.js node.js NPM	수다왕	1,998	6년 전
16308	node.js node.js 파일삭제, 파일 이름 바꾸기	수다왕	8,626	6년 전
16305	node.js nodejs 기초문법 - 클래스 3	수다왕	3,746	6년 전
16304	node.js nodejs 기초문법 - 조건문 반복문	수다왕	2,389	6년 전
16303	node.js nodejs .기초문법 변수선언 , 함수선언	수다왕	2,502	6년 전
16302	node.js nodejs 파일 업데이트	수다왕	2,075	6년 전
16301	node.js nodejs 파일 만들기	수다왕	3,367	6년 전
16300	node.js nodejs 파일 읽기 1	수다왕	2,217	6년 전
16299	node.js Node.js 쿼리 문자열 읽기 , 쿼리 문자열 분할하기	수다왕	1,985	6년 전
16298	node.js NOde.js HTTP 모듈	수다왕	2,046	6년 전
16297	node.js Node.js 모듈	수다왕	1,756	6년 전
16295	node.js nods.js 시작하기	수다왕	2,023	6년 전
16294	node.js node.js 란 2번째	수다왕	2,174	6년 전
16293	node.js Node.js란 1	수다왕	2,392	6년 전

with 블럭 사용하기

댓글 작성

댓글 17개

게시글 목록