이 글에서는 jQuery의 이벤트 응답 및 페이지 요소의 동적 연산과 관련된 구현 기술을 포함하여 목록에 새 요소를 동적으로 추가하는 jQuery의 간단한 방법을 주로 소개합니다. 목록에 새 요소를 동적으로 추가하는 방법 새 요소를 추가하는 방법. 참고용으로 공유합니다. 세부 사항은 다음과 같습니다.
먼저 렌더링을 살펴보겠습니다.
전체 구현 코드는 다음과 같습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>www.jb51.net jQuery列表添加新元素</title>
<script src="jquery-1.7.2.min.js"></script>
</head>
<body>
<h3>li列表：</h3>
<ol>
<li>jb51</li>
<li>php</li>
<li>javascript</li>
<li>HTML5</li>
</ol>
<input type="text" id="text">
<input type="button" id="btn" value="添加">
<script type="text/javascript">
$(function () {
$('#btn').click(function () {
$('ol').append('<li>'+$('#text').val()+'</li>');
});
});
</script>
</body>
</html>위는 제가 컴파일한 것입니다. , 앞으로도 도움이 되길 바랍니다.
관련 기사:
Vue의 datepicker용 샘플 코드로그인하지 않고 웹사이트에서 콘텐츠를 복사할 수 없는 문제를 해결하는 방법Vue의 datepicker 플러그인은 datepicker의 값을 모니터링할 수 없습니다. 입력 상자React의 구성 요소 간 추상화에 대한 자세한 설명React Native의 NavigatorIOS 구성 요소(자세한 튜토리얼 설명)ejsExcel 템플릿 사용 방법에 대해위 내용은 jQuery에서 목록에 동적으로 추가하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
