JavaScript 탈베 테이블의 지정된 위치에 행을 삽입하는 구현 코드 Script House 개정된 version_javascript 기술

최근에 JavaScript를 배우고 있습니다. 제가 직접 만든 예제입니다(w3cschool 예제를 기반으로 함)
이 예제의 기능은 마우스로 클릭한 행 다음에 행을 삽입하는 것입니다. 기본값은 첫 번째에 삽입하는 것입니다. 열. 삽입된 내용을 직접 입력하실 수 있으며, 코드는 다음과 같습니다

<table id="myTable" border="1"> <tr> <td>Row1 cell1</td> <td>Row1 cell2</td> </tr> <tr> <td>Row2 cell1</td> <td>Row2 cell2</td> </tr> <tr> <td>Row3 cell1</td> <td>Row3 cell2</td> </tr> </table> <p> <input type="text" id="cell1" value="cell1"> 셀1:<input type="text" id="cell2" value="cell2"> 셀2:</p> <input type="button" onclick="insRow()" value="插入行">
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다

]


위 내용은 기본적으로 처음에 삽입되는 내용입니다.
여기서 주목해야 할 점은 마우스가 행 삽입 버튼을 클릭하면 액션도 전역 변수를 캡처하고 변경한다는 것입니다. 처음에는 깨닫지 못했습니다. 즉, 추가하지 않았습니다. 위의 빨간색 코드이므로 삽입 행을 클릭할 때마다 첫 번째 줄에 삽입됩니다. 원래 디자인에 따르면 버튼을 클릭하면 전역 변수가 0으로 변경되므로 첫 번째 줄에만 추가할 수 있습니다.
간단한 해결책은 빨간색 코드를 추가하는 것인데, 이를 통해 현재 문제를 피할 수 있습니다.
위 내용은 학습 과정의 작은 경험일 뿐입니다. 특정 행 삭제 또는 지정된 행 앞에 삽입 등의 기능을 완료하기 위한 템플릿으로 사용할 수 있습니다. 자바스크립트를 계속 배우고 소통하세요.