목차
- array.push() 예제 - 배열 뒤에 요소 추가 후, 바뀐 배열 출력
- array.push() 정의
- array.push() 구문
- array.push() 예제 - 요소 2개 추가 후, 배열 개수 반환
- array.push() 예제 - 리스트태그의 내용으로 배열 생성
array.push() 예제 - 배열 뒤에 요소 추가 후, 바뀐 배열 출력
<button onclick="hz()">클릭</button>
<p id="demo"></p>
<script>
var web = ["HTML", "CSS", "JS"];
document.getElementById("demo").innerHTML = web;
function hz() {
web.push("PHP" , "SQL");
document.getElementById("demo").innerHTML = web;
}
</script>
결과값: HTML,CSS,JS,PHP,SQL
array.push() 정의
배열 끝에 새 배열값 추가 후, 바뀐 배열길이 (= 배열개수 length) 반환.
1.
원래 배열의 길이 (= 배열개수 = length 값) 변경.
2. cf.
unshift() 메서드 - 배열 시작 부분에 배열값 추가.
3.
4. MDN push() 예제보기
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push
array.push() 구문
array.push(item1, item2, ..., itemX)
[매개변수]
item1, item2, ..., itemX
필수. 배열에 추가할 배열값
[반환값]
새 배열길이 (= 새 배열개수 = 새로운 length 값) 반환.
array.push() 예제 - 요소 2개 추가 후, 배열 개수 반환
<button onclick="hz()">클릭</button>
<p id="demo"></p>
<script>
var web = ["HTML", "CSS", "JS"];
document.getElementById("demo").innerHTML = web;
function hz() {
x = web.push("PHP" , "SQL");
alert(x); // 5
document.getElementById("demo").innerHTML = web;
}
</script>
결과보기
결과값: 5 얼럿창 뜬 후, HTML,CSS,JS,PHP,SQL
관련예제: 균이 님 (190909) https://sir.kr/qa/322639
array.push() 예제 - 리스트태그의 내용으로 배열 생성
[순수 JavaScript 코드]
<ul id="hz">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<script>
var arr = [];
var liElements = document.querySelectorAll('#hz li');
liElements.forEach(function(li) {
arr.push(li.textContent);
});
console.log(arr); // // [object Array] (3) ["1","2","3"]
</script>
결과보기
[jQuery 코드]
<script src="https://code.jquery.com/jquery-latest.js"></script>
<ul id="hz">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<script>
var arr=[];
$('#hz li').each(function(){
arr.push( $(this).text() );
});
console.log(arr);
</script>
결과보기
균이 님 (230509) https://sir.kr/qa/498675 답변 참고
