프라이D
프라이Develog(❁´◡`❁)
프라이D
전체 방문자
오늘
어제
  • ALL (378)
    • TDD, Cleancode with JavaScr.. (5)
    • 프로젝트 (32)
      • work (3)
      • 직접 만드는 기술 블로그 (2)
      • 데일리 옥션 (19)
      • 모락모락 (8)
    • Computer Science (1)
    • Algorithm & 자료구조 (94)
      • 알고리즘 w.JavaScript (53)
      • 자료구조 (5)
      • (인프런) 자바스크립트 알고리즘 문제풀이 (34)
    • JavaScript (45)
      • JavaScript (41)
      • 모던 자바스크립트 Deep Dive (4)
    • WEB (13)
    • 회고 (12)
    • TIL (109)
    • WIL (7)
    • Stacks (20)
      • React.js (6)
      • Next.js (1)
      • Redux (3)
      • Node.js (2)
      • GIT (2)
      • SAP (1)
    • 15일 메이킹 프로젝트 (15)
    • 이전 기록 (14)
    • ETC. (5)
    • ---------------2021 (6)
      • 내일배움단-웹개발 5주 (2)
      • 정보처리기사 (4)

블로그 메뉴

  • 홈
  • 태그
  • 미디어로그
  • 위치로그
  • 방명록

공지사항

인기 글

태그

  • 코딩프로젝트
  • vanilaJS
  • MySQL
  • 2023 인프콘 후기
  • 내일배움단
  • 알고리즘
  • 국비지원
  • Til
  • 자바스크립트비트마스크
  • nomadcoders
  • 비트마스크
  • 자바스크립트
  • nomadcoder
  • 모던자바스크립트딥다이브
  • JavaScript
  • 내일배움카드
  • 스파르타코딩클럽
  • 투포인터알고리즘
  • 자바스크립트알고리즘
  • 코드스테이츠

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
프라이D

프라이Develog(❁´◡`❁)

JavaScript/JavaScript

[JS]2021-1115 자바스크립트 .createElement() & .appendChild - HTML 요소 추가하기

2021. 11. 15. 21:53

document.creatElement()

document 객체의 메소드로, HTML 요소를 생성할 수 있다.

const bgImage = document.createElement("img");
//img태그 생성

부모노드.appendChild()

특정 요소에 자식 요소를 추가할 수 있다.

document.body.appendChild(bgImage);
//body 내부에 bgImage를 추가

배열 내의 랜덤 이미지 화면에 출력하기

const images = [
    "0.jpg",
    "1.jpg",
    "2.png"
];

const chosenImage = images[Math.floor(Math.random() * images.length)];

const bgImage = document.createElement("img");

bgImage.src = `img/${chosenImage}`;

document.body.appendChild(bgImage);
저작자표시 (새창열림)

'JavaScript > JavaScript' 카테고리의 다른 글

[JavaScript] 비트 연산 Bit Operation  (0) 2022.03.20
[JS] 전위 연산자, 후위 연산자  (0) 2022.02.08
[JS]2021-1114 자바스크립트 Math - Random number 랜덤 숫자 생성 /반올림, 올림, 버림  (0) 2021.11.14
[JS]2021-1114 padStart() - 문자열 시작 채우기(문자열을 채워 원하는 길이로 만들기)/ String() - 숫자를 문자열로 바꾸기  (0) 2021.11.14
[JS]2021-1114 Date - 자바스크립트로 현재 시간 불러오기/ setInterval(),setTimeout() - 타이머 함수  (0) 2021.11.14
    'JavaScript/JavaScript' 카테고리의 다른 글
    • [JavaScript] 비트 연산 Bit Operation
    • [JS] 전위 연산자, 후위 연산자
    • [JS]2021-1114 자바스크립트 Math - Random number 랜덤 숫자 생성 /반올림, 올림, 버림
    • [JS]2021-1114 padStart() - 문자열 시작 채우기(문자열을 채워 원하는 길이로 만들기)/ String() - 숫자를 문자열로 바꾸기
    프라이D
    프라이D
    틀린내용 정정 및 개선사항은 언제든지 댓글 달아주세요 :D

    티스토리툴바