HTML DOM의 Location port 속성은 현재 URL에서 지정된 포트 번호를 반환하거나 새로 설정하는 데 사용됩니다. 만약 URL에 포트 번호가 명시적으로 지정되어 있지 않다면, 이 속성은 빈 문자열을 반환하며 포트 정보가 화면에 나타나지 않을 수 있습니다.문법(Syntax)Location port 속성의 기본 문법은 다음과 같습니다.1. port 속성 값 반환하기location.port2. port 속성 값 설정하기location.port = portNumber예제(Example)아래 예제를 통해 Location port
HTML DOM의 Location protocol 속성은 현재 URL에서 사용 중인 프로토콜(protocol)에 해당하는 문자열을 반환하거나 설정합니다. 프로토콜 값은 file:, http:, https: 등으로 지정할 수 있으며, 반환되는 문자열에는 항상 콜론(:)이 포함됩니다. 구문 다음은 Location protocol 속성의 기본 구문입니다 − protocol 속성의 값을 반환하는 경우 location.protocol protocol 속성의 값을 설정하는 경우 location.protocol = protoc
HTML DOM의 Location reload() 메서드는 현재 문서를 다시 불러오는(리렌더링) 데 사용되는 메서드입니다. 이 메서드는 브라우저의 새로고침 버튼을 클릭했을 때와 동일한 기능을 수행하며, 자바스크립트만으로 페이지를 간편하게 갱신할 수 있도록 도와줍니다.문법(Syntax)reload() 메서드의 기본 문법은 다음과 같습니다.location.reload(forceGetParameter)매개변수(Parameters)forceGetParameter는 선택적으로 지정할 수 있는 값으로, 다음 두 가지 중 하나를 사용할 수 있습
HTML DOM의 Location replace() 메서드는 현재 문서를 새 문서로 대체하여 화면에 렌더링하는 데 사용됩니다. 이 메서드의 가장 큰 특징은 브라우저의 세션 히스토리에서 현재 문서의 URL을 제거한다는 점입니다. 따라서 페이지가 이동한 후에는 뒤로 가기 버튼을 눌러도 이전 문서로 돌아갈 수 없습니다. 구문 replace() 메서드의 기본 구문은 다음과 같습니다 − location.replace(URLString) URLString 매개변수에는 이동하고자 하는 새 문서의 URL을 문자열 형태로 전달합니다.
HTML DOM의 li value 속성은 <li> 요소의 value 속성값을 반환하거나 설정하는 데 사용됩니다. 이 속성을 활용하면 정렬된 목록(<ol>)에서 특정 목록 항목의 표시 번호를 동적으로 변경할 수 있어, 순서를 재조정해야 하는 상황에서 매우 유용합니다.문법(Syntax)li value 속성의 기본 문법은 다음과 같습니다.<li> 요소의 value 속성값을 반환하는 경우liObject.value<li> 요소의 value 속성값을 설정하는 경우liObject.value = stri
HTML DOM의 Link disabled 속성은 <link> 요소가 활성화되어 있는지 비활성화되어 있는지를 설정하거나 반환하는 속성입니다. 이 속성을 활용하면 자바스크립트를 통해 외부 스타일시트의 적용 여부를 동적으로 제어할 수 있습니다.문법(Syntax)disabled 속성의 기본 문법은 다음과 같습니다.1. boolean 값 반환하기<link> 요소의 현재 상태를 true 또는 false 값으로 가져옵니다.linkObject.disabled2. disabled 값 설정하기<link> 요소를 활성
HTML DOM의 Link href 속성은 <link> 요소로 연결된 문서의 경로(path) 또는 URL을 설정하거나 반환하는 데 사용됩니다. 주로 외부 스타일시트(CSS)를 동적으로 교체할 때 유용하게 활용됩니다.문법(Syntax)href 속성의 기본 문법은 다음과 같습니다.1. href 값 반환하기linkObject.href2. href 값 설정하기linkObject.href = string속성값 설명여기서 string은 아래와 같은 값을 가질 수 있습니다.속성값설명path연결할 문서의 절대 경로 또는 상대 경로를 정
HTML DOM Link hreflang 속성이란?HTML DOM의 Link hreflang 속성은 <link> 요소로 연결된 문서가 작성된 언어 코드를 가져오거나 설정하는 데 사용됩니다. 이 속성은 주로 외부 스타일시트나 다른 리소스가 어떤 언어로 작성되었는지 브라우저와 검색 엔진에 알려주는 역할을 합니다.구문hreflang 속성의 기본 구문은 다음과 같습니다.hreflang 속성 값 반환하기linkObject.hreflanghreflang에 언어 코드 설정하기linkObject.hreflang = langCode언어
HTML DOM의 Link 객체는 HTML 문서 내의 <link> 요소를 대표하는 객체입니다. <link> 요소는 주로 외부 스타일시트(CSS)나 파비콘 등 외부 리소스를 현재 문서에 연결할 때 사용됩니다.문법(Syntax)다음은 Link 객체의 기본적인 사용 문법입니다.<link> 요소 생성하기var linkObject = document.createElement(LINK)주요 속성(Properties)Link 객체는 아래와 같은 속성들을 제공합니다.속성설명crossOrigin연결된 문서의 CORS
HTML DOM의 Link rel 속성은 현재 문서와 <link> 요소로 연결된 외부 문서 사이의 관계(relationship)를 설정하거나 반환하는 속성입니다. 웹 표준상 rel 속성은 필수로 명시해야 하며, 스타일시트 연결, 아이콘 지정, 성능 최적화 등 다양한 용도로 활용됩니다.문법(Syntax)rel 속성의 기본 사용 문법은 다음과 같습니다.1. rel 속성 값 반환하기linkObject.rel2. rel 속성 값 설정하기linkObject.rel = valueStringvalueString 종류rel 속성에 지정
HTML DOM Link sizes 속성이란? HTML DOM의 Link sizes 속성은 <link> 요소의 sizes 속성(attribute) 값을 반환합니다. sizes 속성은 주로 파비콘(favicon)처럼 웹사이트 아이콘을 연결할 때 해당 아이콘의 크기를 지정하는 용도로 사용됩니다. 참고: sizes 속성은 link 요소의 rel 속성이 icon으로 설정된 경우에만 유효합니다. 그 외의 rel 값에서는 의미가 없으므로 반드시 함께 사용해야 합니다. 문법(Syntax) sizes 속성값을 반환하는 기본 문법은 다음
HTML DOM Link type 속성이란? HTML DOM의 type 속성은 <link> 요소로 연결된 외부 문서의 유형(MIME 타입)을 설정하거나 반환하는 기능입니다. 예를 들어 스타일시트는 text/css, 자바스크립트 파일은 text/javascript처럼 문서의 종류를 브라우저에 알려주는 역할을 합니다. 문법(Syntax) Link type 속성의 기본 문법은 다음과 같습니다. type 속성값 반환하기 linkObject.type type 속성에 유효한 값 설정하기 linkObject.type = v
HTML DOM의 links 컬렉션은 문서 내에 존재하는 모든 <a> 태그와 <area> 태그에 해당하는 링크들을 목록 형태로 반환하는 기능입니다. 웹페이지 안의 하이퍼링크를 동적으로 조회하거나 관리해야 할 때 매우 유용하게 활용됩니다. 기본 구문 links 컬렉션을 가져오는 기본 문법은 다음과 같습니다. document.links 이 코드를 실행하면 현재 문서에 포함된 모든 링크 요소들이 담긴 컬렉션이 반환됩니다. 주요 속성 및 메서드 links 컬렉션에서 사용할 수 있는 대표적인 속성과 메서드는 아래와 같습
개요HTML DOM의 localStorage clear() 메서드는 웹 브라우저의 로컬 스토리지(Local Storage)에 저장된 모든 데이터를 한 번에 삭제하는 데 사용됩니다. 키-값 형태로 저장된 항목을 개별적으로 지우는 것이 아니라, 해당 도메인(오리진)에 저장된 전체 항목을 한꺼번에 비울 때 유용합니다.이 메서드는 별도의 매개변수를 받지 않으며, 반환값도 없습니다. 호출 즉시 스토리지가 비워집니다.문법(Syntax)기본 문법은 다음과 같습니다.localStorage.clear()세션 스토리지(Session Storage)에
HTML DOM에서 Label 객체는 HTML의 <label> 요소를 나타냅니다. <label> 요소는 폼 컨트롤에 대한 설명 텍스트를 제공하는 역할을 하며, 자바스크립트를 통해 동적으로 생성하거나 조작할 수 있습니다. 문법(Syntax) <label> 요소를 새로 생성하는 기본 문법은 다음과 같습니다. var labelObject = document.createElement(LABEL); 주요 속성(Properties) Label 객체에서 사용할 수 있는 주요 속성은 다음과 같습니다. 속성설명
문제 개요이 글에서는 사용자가 입력한 숫자 목록에서 주어진 합계를 구성할 수 있는 요소들을 찾아 출력하는 방법을 알아봅니다. 먼저 입력받을 요소의 개수(N)를 정하고, 임의의 값들을 입력한 뒤, 확인하고 싶은 합계를 지정하면 프로그램이 조건에 맞는 요소들을 골라 보여줍니다.입력 : N=5임의의 5개 값 입력 : 3 1 6 5 7확인하려는 합계 입력 : 10출력 : 3 1 6위 예제에서 3 + 1 + 6 = 10이므로, 합계 10을 만족하는 요소들은 3, 1, 6입니다.알고리즘핵심 아이디어는 간단합니다. 배열을 처음부터 끝까지 순회하
HTML DOM lang 속성은 요소 콘텐츠에 적용된 언어 코드를 나타내는 문자열을 반환하거나 설정합니다. 예를 들어 영어(English)는 en, 스페인어(Spanish)는 es처럼 ISO 639-1 표준 두 자리 언어 코드를 사용합니다. 이 속성을 활용하면 스크린 리더, 검색 엔진, 번역 도구 등이 콘텐츠의 언어를 정확하게 인식하도록 도울 수 있습니다. 문법 lang 속성의 기본 문법은 다음과 같습니다. 언어 코드 반환하기 HTMLElementObject.lang 언어 코드 설정하기 HTMLElementObject.lang =
HTML DOM의 lastChild 속성은 지정된 노드의 마지막 자식 노드를 노드 객체 형태로 반환합니다.주의: 이 속성은 텍스트 노드와 주석(주석) 노드를 무시하지 않습니다. 따라서 마지막 자식이 요소가 아닌 공백이나 줄바꿈일 경우에도 그대로 반환되므로 사용 시 각별히 주의해야 합니다.구문lastChild 속성의 기본 구문은 다음과 같습니다.nodeList.lastChild예제아래 예제를 통해 HTML DOM lastChild 속성의 실제 동작을 확인해 보겠습니다.<!DOCTYPE html> <html> &l
HTML DOM lastElementChild 속성이란? HTML DOM의 lastElementChild 속성은 지정된 노드의 마지막 자식 요소 노드(element node)를 노드 객체 형태로 반환합니다. 이 속성을 활용하면 특정 부모 요소 안에서 가장 마지막에 위치한 자식 요소에 손쉽게 접근할 수 있습니다. 참고: 이 속성은 텍스트 노드(text node)와 주석 노드(comment node)는 무시하고, 오직 요소 노드만을 대상으로 동작합니다. 따라서 공백이나 줄바꿈 같은 텍스트 노드가 존재해도 결과에 영향을 주지 않으므로,
HTML DOM의 lastModified 속성은 현재 문서가 마지막으로 수정된 날짜와 시간을 문자열 형태로 반환합니다. 이 속성은 읽기 전용(read-only)이며, 별도의 매개변수 없이 간단하게 호출할 수 있어 웹페이지의 최신 업데이트 정보를 사용자에게 표시할 때 유용하게 활용됩니다. 구문 lastModified 속성의 기본 구문은 다음과 같습니다. document.lastModified 예제 다음 예제를 통해 HTML DOM lastModified 속성의 실제 사용 방법을 살펴보겠습니다. 이 예제에서는 버튼을 클릭하면 해당