선배의 시험 시스템을 테스트 할 때 왼쪽 후보자의 정보 부분을 숨길 수있는 시험 페이지를 보았습니다. 그 당시 나는 매우 키가 크고 인도적이라고 느꼈다. 이제 JavaScript를 배웠 으므로이 기능을 구현할 수도 있습니다. 보여 드리겠습니다.
1. 페이지 디자인 :
(1) .html 코드 :
<title> js 열 </title> <스타일 유형 = "text/css"> .Alignment {text-align : center; } </style> </head> <script language = "javaScript"type = "text/javaScript"> // ...... </script> <body> <table> <td> <td id = "lanmu"> <p> <a href = "#"> column 1 </a> </p> <p> <a href = "#"> cample </p>>>>>>>>>>>>>>>>>>>> </p>> < "> href = "#"> 열 3 </a> </a> </p> <p> <a href = "#"> 열 4 </a> </p> <p> <a href = "#"> 열 4 </a> </p> <p> <a href = "#"> column 1 </a> <p> <a href = "#"> column 2 </a> "> href = "#"> 열 3 </a> </p> <p> <a href = "#"> 열 4 </a> </p> <p> <a href = "#"> 열 5 </a> </p> </td> <td> <span id = "pic"> <img src = "image/png. <td> 이것은 내용 영역입니다! </td> </tr> </table> </body> </html>(2). 참고 : 실제로이 페이지는 매우 간단합니다. 하나의 행과 3 개의 열이있는 테이블 만 있으면됩니다. 첫 번째 부분은 열 이름을 표시하고 세 번째 부분은 기본 내용입니다. 중간에는 왼쪽 (오른쪽) 화살표의 그림이 있습니다. 나는 너무 많이 생각했고 그것이 매우 멋진 통제라고 생각했습니다.
2. 자바 스크립트 코드 :
<script language = "javaScript"type = "text/javaScript"> 함수 hide () // 왼쪽 화살표를 클릭하여 열 부분을 숨기려면 {// 1 단계 : 열 목록 문서를 숨 깁니다. // 2 단계 : 화살표 이미지를 동시에 교체합니다. 왼쪽 화살표에 응답하는 이벤트는 show () document.getElementByid ( "pic")를 표시하는 것입니다. innerHtml = "<img src = 'image /right.png'onclick = 'show ()' />"; } function show () // 오른쪽 화살표를 클릭하여 숨겨진 열 부분을 표시하려면 {// 1 단계 : 열 목록 문서를 표시합니다. // 2 단계 : 화살표 이미지를 동시에 변경합니다. 왼쪽 화살표에 응답하는 이벤트는 hide () document.getElementByid ( "pic")를 숨기는 것입니다. innerhtml = "<img src = 'image /left.png'onclick = 'hide ()' />"; } </스크립트>(1) 효과 :
(2) 참고 : "왼쪽 화살표"가 처음 표시됩니다. 그림을 클릭하면 Hide () 이벤트에 응답하고 열 부분을 숨기고 왼쪽 화살표를 오른쪽 화살표로 변경합니다. "오른쪽 화살표"를 클릭하면 Show () 이벤트가 응답하고 숨겨진 열 부분을 표시하고 오른쪽 화살표가 왼쪽 화살표로 대체 된 다음 원래 상태로 돌아갑니다. 이것은 실제로 매우 간단하고 쉽게 할 수 있습니다.
JavaScript 학습 의이 단계를 통해 매우 흥미로운 느낌이 듭니다. 내가 전에 아무것도 몰랐을 때, 나는 항상 그것이 열심히 생각했고, 나에게 심리적 압력을 가했다. 내가 직접 경험했을 때, 나는 그것이 단지 그것이 단지 그 일임을 발견하고 학습에 대한 관심을 천천히 발전 시켰다는 것을 알았습니다. 이제 웹 사이트에 로그인하거나 소프트웨어를 사용할 때 비자발적으로 구현 방법, 잘 수행되는 위치 및 개선이 필요한 곳을 고려하고 전문가에게 점차 접근해야합니다.
JavaScript에는 여전히 많은 것을 배울 수 있습니다. 오늘날 우리가 보여주는 것은 빙산의 일각 일뿐입니다. 관심과 호기심으로 계속 응원하십시오!