HTML DOM 입력 FileUpload 객체

<시간/>

HTML DOM 입력 FileUpload Object는 HTML 문서의

입력 FileUpload 객체를 생성하는 방법을 알아보겠습니다 -

구문

다음은 구문입니다 -

var fileUploadBtn = document.createElement(“INPUT”);
fileUploadBtn.setAttribute(“type”,”file”);

속성

다음은 HTML DOM 입력 fileupload Object의 속성입니다 -

속성	설명
수락	입력 파일 업로드 버튼의 accept 속성 값을 반환하고 수정합니다.
자동 초점	입력 파일 업로드 버튼이 페이지 로드에 자동으로 초점을 맞출지 여부를 반환하고 수정합니다.
비활성화	입력 파일 업로드 버튼의 기본값을 반환하고 수정합니다.
기본값	입력 파일 업로드 버튼의 accept 속성 값을 반환하고 수정합니다.
파일	입력 파일 업로드 버튼으로 선택한 모든 파일을 참조하는 파일 목록 객체를 반환합니다.
형식	파일 업로드 입력 버튼을 둘러싸는 폼의 참조를 반환합니다.
다중	사용자가 여러 파일을 선택할 수 있는지 여부를 반환하고 수정합니다.
이름	입력 파일 업로드 버튼의 name 속성 값을 반환 및 수정합니다.
필수	입력 파일 업로드 버튼의 필수 속성 값을 반환 및 수정합니다.
유형	입력 파일 업로드 버튼의 type 속성 값을 반환 및 수정합니다.
값	입력 파일 업로드 버튼의 value 속성 내용을 반환 및 수정합니다.

예시

HTML DOM 입력 파일 업로드 객체의 예를 살펴보겠습니다 -

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
   }
   .btn{
      background-color:lightblue;
      border:none;
      height:2rem;
      border-radius:50px;
      width:60%;
      margin:1rem auto;
      display:block;
   }
</style>
</head>
<body>
<h1>DOM Fileupload Object Example</h1>
<button onclick="createFileBtn()" class="btn">Click me to create an input file upload button</button>
<script>
   function createFileBtn() {
      var fileUploadBtn = document.createElement("INPUT");
      fileUploadBtn.setAttribute("type", "file");
      document.body.appendChild(fileUploadBtn);
   }
</script>
</body>
</html>

출력

이것은 다음과 같은 출력을 생성합니다 -

HTML DOM 입력 FileUpload 객체

"파란색을 클릭합니다. ” 버튼을 눌러 파일 업로드 버튼을 생성합니다.

HTML DOM 입력 FileUpload 객체