예전 블로그에 포스팅한 글이 우연히 스쿨[PHPSchool]에서 보다가 발견했다.
그때에 2007년이였으니 Prototype 1.5.0 에서 적용되던 것이였는데...... 

extjs에서 크로스도메인 처리하던 localXHR.js와 같은 기능을 하는것이다.
localXHR에서 사용된 개념과 비슷하게 여기에서도 동적으로 <script>태그로 생성한다. 시간나실때 짬짬히 뜯어보시는것도... 괜찮을듯 하다.

사용법은 간단한다. prototype.js 를 import한뒤 아래에 transport.js를 import해서 기존 Prototype.js의 Ajax.Request 클래스를 상속받아 쓰면 된다.

Prototype.js에서 사용할때와 같이

Prototype.js 1.6.0 버전에서 쓰려면 기존 transport.js 하단 상속부분을 다음과 같이 수정해 주면 된다.

transport_Prototype1.5.0.js

transport_Prototype1.6.0.js

dynamic_head_append_test.html

invalid-file

<div id="protoflow">

        <img src="imgs/DSCN0940_91360.jpg"/>

        <img src="imgs/stimme_von_oben_187192.jpg"/>

        <img src="imgs/Tropfen_1_Kopie_201721.jpg"/>

        <img src="imgs/farbraum_012_147508.jpg"/>

        <img src="imgs/IMG_4906_199357.jpg"/>

        <img src="imgs/Tropfen_1_Kopie_201721.jpg"/>

        <img src="imgs/Fries_201253.jpg"/>

        <img src="imgs/Fries_201253.jpg"/>

</div>

 

<ul id="protoCaptions" class="protoCaptions">

        <li>Caption 1</li>

        <li>Caption 2</li>

        <li>Caption 3</li>

        <li>Caption 4</li>

        <li>Caption 5</li>

 

        <li>Caption 6</li>

        <li>Caption 7</li>

        <li>Caption 8</li>

</ul>





Event.observe(window, 'load', function() { 

  cf = new ProtoFlow($("protoflow"), {captions: 'protoCaptions'});

});