자바스크립트 테이블 행 삭제

JavaScript에서는 DOM 조작을 통해 테이블의 행을 쉽게 삭제할 수 있습니다. 다음은 테이블에서 행을 삭제하는 두 가지 기본 방법을 소개합니다.

1. 삭제는 table 테이블 객체의 deleteRow() 메소드를 통해 이루어집니다.

HTML에서는 삭제할 행 번호에 id를 할당하거나 삭제할 행의 위치를 ​​지정하여 삭제할 수 있습니다. 코드는 다음과 같습니다.

코드 설명:

• 이 메서드의 deleteRow() 메서드는 지정된 위치(0부터 계산)의 행을 삭제하는 데 사용됩니다.
• 이 예에서는 첫 번째 행의 위치가 0이고 두 번째 행의 위치가 1입니다.
• 삭제하려는 행이 테이블에 없으면 오류가 발생합니다.
• 테이블에 해당하는 변수를 도입해야 합니다. 변수의 값은 getElementById() 또는 다른 방법을 사용하여 얻을 수 있습니다.

2. 삭제는 HTMLElement 객체의 parentNode 속성을 통해 이루어집니다.

위의 방법 외에도 parentNode 속성을 사용하여 요소를 삭제할 수도 있습니다. HTML에서는 현재 선택된 행 요소의 상위 요소, 즉 테이블의 tbody 요소를 가져와서 행을 삭제할 수 있습니다. 코드는 다음과 같습니다.

코드 설명:

• 먼저 삭제할 행 요소를 가져오면 getElementById() 메서드나 다른 메서드를 사용하여 가져올 수 있습니다.
• 그런 다음 행 요소 개체의 parentNode 속성을 사용하여 테이블 테이블 개체를 가져오고 해당 개체에서 tbody 요소를 가져옵니다.
• 마지막으로 tbody 객체의 RemoveChild() 메서드를 사용하여 선택한 행 요소를 제거합니다.

요약

deleteRow() 메서드를 사용하거나 parentNode 속성을 사용하면 테이블의 행을 쉽게 삭제할 수 있습니다. 많은 개발자는 단순성과 명확성의 이점을 고려하여 deleteRow() 메서드 사용을 선호합니다. 반면에 parentNode 특성을 사용하는 것은 HTML 문서의 모든 요소에 사용할 수 있는 보다 일반적인 접근 방식입니다. 재사용 가능한 기능을 구현하려는 개발자의 경우 parentNode 특성을 사용하는 것이 의심할 여지 없이 더 적합합니다.

위 내용은 자바스크립트 테이블 행 삭제의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!