JavaScript - 테스트 프로토타입


JavaScript 프레임워크 라이브러리 테스트 - 프로토타입

프로토타입 참조

JavaScript 라이브러리를 테스트하려면 웹 페이지에서 참조해야 합니다.

라이브러리를 참조하려면 src 속성이 라이브러리의 URL로 설정된 <script> 태그를 사용하세요.

Reference Prototype

<!DOCTYPE html>
<html>
<head>
< ; script
src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js">
</script>
</head>
<body>
< body>
</html>

Prototype 설명

Prototype은 HTML DOM 프로그래밍을 더 쉽게 만드는 기능을 제공합니다.

jQuery와 유사하게 Prototype에도 자체 $() 함수가 있습니다.

$() 함수는 HTML DOM 요소(또는 DOM 요소)의 id 값을 받아들이고 DOM 객체에 새로운 기능을 추가합니다.

jQuery와 달리 Prototype에는 window.onload()를 대체할 Ready() 메서드가 없습니다. 대신 Prototype은 브라우저와 HTML DOM에 확장 기능을 추가합니다.

JavaScript에서는 창 로드 이벤트를 처리하는 함수를 할당할 수 있습니다.

JavaScript 방식:

function myFunction()
{
var obj=document.getElementById("h01");
obj.innerHTML=" Hello Prototype";
}
onload=myFunction;

동등한 프로토타입이 다릅니다:

프로토타입 방법:

function myFunction()
{
$("h01").insert("Hello Prototype! ") ;
}
Event.observe(window,"load",myFunction);

Event.observe()는 세 가지 매개변수를 허용합니다:

  • 객체를 처리하려는 HTML DOM 또는 BOM(브라우저 개체 모델)

  • 처리하려는 이벤트

  • 호출하려는 함수

테스트 프로토타입

다음 예를 시도해 보세요.

Instance 

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js"></script>
<script>
function myFunction(){
	$("h01").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
	
<h1 id="h01"></h1>
</body>
	
</html>

실행 예 »

"를 클릭하세요. 온라인 인스턴스를 보려면 인스턴스 실행" 버튼을 클릭하세요.

이 예제를 다시 시도하세요.

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js"></script>
<script>
function myFunction(){
	$("h01").writeAttribute("style","color:red").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>

인스턴스 실행»

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

원하는 대로 위의 예에서 볼 수 있듯이 Prototype은 jQuery와 마찬가지로 체인 구문을 허용합니다.

체인 연결은 동일한 개체에 대해 여러 작업을 수행하는 편리한 방법입니다.