• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Form] JS - input 태그의 name 속성값이 배열일 때, value값 가져오기 (= 폼태그 안 인풋 태그 네임 속성 배열값 접근 방법)

input 태그 name 속성값이 배열일 때 접근법

 

<script src="https://code.jquery.com/jquery-latest.js"></script>


<form name="hzform">

    <input type="text" name="hz[]" value="홈짱닷컴"/>

    <input type="text" name="hz[]" value="Homzzang.com"/>

    <input type="text" name="hz[]" value="홈페이지 제작관리"/>

</form>


<script type="text/javascript">

console.clear(); // 콘솔 청소


// JS name 접근 방식

var a = document.getElementsByName("hz[]")[0].value;

console.log(a); // 홈짱닷컴


// JS form명 접근 방식

var b = document.hzform["hz[]"][1].value;

console.log(b); // Homzzang.com


// jQuery name 접근 방식

var c = $('input[name="hz[]"]')[2].value;

console.log(c); // 홈페이지 제작관리

</script>

 

결과보기 

PS. Codepen 사이트 좌측 하단의 Console 버튼 클릭하면 결과 확인 가능.

사용자하요_ 님 (190328) https://orothi.tistory.com/3



분류 제목
HTML_Objects JS - <option> 객체 ★ - 선택사항 (= 옵션사항 = option태그 = 옵션태그)
HTML_Objects JS - <output> 객체 - 계산결과값출력 (= 산출태그 = output태그 = 아웃풋태그) (HTML…
HTML_Objects JS - <p> 객체 - 글단락 (= p태그 = p요소 = 글문단 = 단락태그 = 문단태그 = 피태그)
HTML_Objects JS - <param> 객체 - 미디어매개변수 (= param태그 = 패럼태그 = 파람태그 = 패러미터태그 …
HTML_Objects JS - <pre> 객체 ★ - 공백줄바꿈보존 (= 보존태그 = 있는그대로태그 = 있는대로태그 = pre태그…
HTML_Objects JS - <progress> 객체 - 진행상태바 (=진행바 = 진행막대 = 작업막대 = progress태그 …
HTML_Objects JS - <q> 객체 - 짧은인용구 (= 짧은인용태그 = q태그 = 큐태그)
HTML_Objects JS - <s> 객체 - 취소선 (= 취소태그 = s태그 = 에스태그 = 스트라이크쓰루태그) (HTML5 재…
HTML_Objects JS - <samp> 객체 - 프로그램산출예제 (= 예제태그 = samp태그 = 샘프태그 = 샘플태그)
HTML_Objects JS - <script> 객체 ★ - JS코드입력 (= 동적기능언어입력 = script태그 = 스크립트태그)
HTML_Objects JS - <section> 객체 ★ - 문서단락 (= section태그 = 섹션태그, IE9)
HTML_Objects JS - <select> 객체 ★★ - 선택메뉴 (= select메뉴 = select태그 = 실렉트태그/셀렉…
HTML_Objects JS - <small> 객체 - 작은글씨 (= small태그 = 스몰태그)
HTML_Objects JS - <source> 객체 - 미디어소스 불러오기 (= source태그 = 소스태그, IE9)
HTML_Objects JS - <span> 객체 ★★★ - 인라인요소그룹 (= span태그 = 스팬태그)</span>
HTML_Objects JS - <strong> 객체 ★ - 굵은 글씨 (=폰트 굵게 = 글씨 굵게 = strong태그 = 스트롱태…
HTML_Objects JS - <style> 객체 ★ - 요소에 CSS스타일적용 (= style태그 = 스타일태그)
HTML_Objects JS - <sub> 객체 ★ - 아래첨자 (= 하단작은글씨 = 하단태그 = sub태그 = 서브태그)
HTML_Objects JS - <summary> 객체 - 세부사항의 머리글 (= summary태그 = 서머리태그 = 써머리태그)…
HTML_Objects JS - <sup> 객체 ★ - 위첨자 (= 상단작은글씨 = 상단태그 = sup태그 = 섭태그 = 서프태그 …
59/67
목록
찾아주셔서 감사합니다. Since 2012