DAY 92. JavaScript 배열 연습 문제 - 배열에 추가, 삭제

 

 

<!-- HTML 코드 -->

    <fieldset>
        <legend>보기</legend>
        <label id="stringla4">피자 치킨 당근 햄버거 떡볶이</label><br>
    </fieldset>
    
    <br>
    
	<input type="text" id="remove" size="25" placeholder="삭제할 음식 이름을 입력하세요">
	<input type="text" id="add" size="25" placeholder="추가할 음식 이름을 입력하세요">
    <p id="p3" style="border:1px solid red;">이 부분에 정답이 출력 될 수 있도록 하세요</p>
	<button onclick="test4();">처리 및 출력</button>

 

// 4번 <내가 작성한 코드>

function test4(){
    let stringla4 = document.getElementById('stringla4').innerHTML;
    console.log(stringla4);
    let la4List = stringla4.split(' ');
    console.log(la4List);
    
    let remove = document.getElementById('remove').value;
    let add = document.getElementById('add').value;

    // let d = la4List.indexOf(remove);
    // let p = la4List.indexOf(add);

    // console.log(la4List[2]); // 당근

    for(let i = 0; i < la4List.length; i++){
        if (la4List[i] === remove){
            la4List.splice(i,1);

            break;
        }
    }
        la4List.push(add);

    p3.innerHTML = `결과-> ${la4List.join(' ')}`;
    // document.getElementById('p3').innerHTML = la4List.join(' ');
};