JavaScript - Тест Prototype

Тест библиотеки JavaScript-фреймворка - Prototype

Ссылка на Prototype

Чтобы протестировать библиотеку JavaScript, необходимо подключить её на веб-странице.

Чтобы подключить библиотеку, используйте тег <script> с атрибутом src, установленным в URL библиотеки:

Ссылка на Prototype

<!DOCTYPE html> <html> <head> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js"> </script> </head> <body> </body> </html>

Описание Prototype

Функции, предоставляемые Prototype, упрощают программирование HTML DOM.

Подобно jQuery, Prototype также имеет свою собственную функцию $().

Функция $() принимает значение id элемента HTML DOM (или DOM-элемент) и добавляет новую функциональность DOM-объекту.

В отличие от jQuery, Prototype не имеет метода ready() для замены window.onload(). Вместо этого Prototype добавляет расширения к браузеру и HTML DOM.

В JavaScript можно назначить функцию для обработки события загрузки window:

Способ JavaScript:

function myFunction() { var obj=document.getElementById("h01"); obj.innerHTML="Привет, Prototype"; } onload=myFunction;

Эквивалентный подход в Prototype отличается:

Способ Prototype:

function myFunction() { $("h01").insert("Привет, Prototype!"); } Event.observe(window,"load",myFunction);

Event.observe() принимает три параметра:

  • Объект HTML DOM или BOM (Browser Object Model), который вы хотите обработать
  • Событие, которое вы хотите обработать
  • Функция, которую вы хотите вызвать

Проверить Prototype

Пожалуйста, попробуйте следующий пример:

Пример

<!DOCTYPE html> <html> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js"> </script> <script> function myFunction() { $("h01").insert("Привет, Prototype!"); } Event.observe(window,"load",myFunction); </script> </head> <body> <h1 id="h01"></h1> </body> </html>

Попробуйте »

Пожалуйста, попробуйте этот пример еще раз:

Пример

<!DOCTYPE html> <html> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js"> </script> <script> function myFunction() { $("h01").writeAttribute("style","color:red").insert("Привет, Prototype!"); } Event.observe(window,"load",myFunction); </script> </head> <body> <h1 id="h01"></h1> </body> </html>

Проверить это »

Как видно из примеров выше, подобно jQuery, Prototype позволяет использовать синтаксис цепочек.

Цепочка — удобный способ выполнения нескольких задач над одним и тем же объектом.

Другие расширения