Насколько это плохо - встроенные вызовы js с определением внешних обработчиков VS полностью внешние js - PullRequest
Новая
       6

Насколько это плохо - встроенные вызовы js с определением внешних обработчиков VS полностью внешние js

2 голосов
/ 16 мая 2011

Я сталкиваюсь со следующим кодом в моем проекте:

HTML: 

<input type="button" id="addmore" value="Add more" onclick="add_table(this)"/>

ЯШ: 

function add_table(elem){
    var current_id = jQuery("table.t1:last").attr("id");

Сначала я подумал, что этот код неправильный, и я должен переписать его во внешний код, т.е. 

jQuery('#addmore)'.click(function add_table(elem){
    var current_id = jQuery("table.t1:last").attr("id");

Но потом я снова посмотрел на него и обнаружил, что этот html более читабелен - я вижу, какие функции привязываются к каким элементам уже в html, и мне не нужно искать его в js.

Конечно, он не инкапсулирован внутри 

jQuery(document).ready(

так что он не будет работать при некоторых обстоятельствах

Итак, вопрос: насколько плох этот код?

Ответы [ 2 ]

4 голосов
/ 16 мая 2011

Это вопрос повторного использования и личного вкуса. Встроенный код более читабелен для очень простых вещей, таких как ваш пример, но, конечно, вы полагаетесь на add_table() как глобальную функцию - если у вас есть сотни элементов с различными обработчиками кликов, вы можете получить сотни функций / переменных, загрязняющих глобальное пространство имен. И это плохо! :)

С точки зрения повторного использования, я считаю, что лучше кодировать в отдельных компонентах, которые абстрагируют функциональность и могут вызываться при необходимости - все в пределах определенного (неглобального) пространства имен. 

jQuery('#addmore)'.click(function add_table(elem) {
    var current_id = jQuery("table.t1:last").attr("id");
}

Приведенный выше код дает хорошее разделение интересов - это означает, что семантическая информация (HTML) забывает о поведенческой информации (Javascript), что опять-таки помогает создавать более чистый и более управляемый код.

2 голосов
/ 16 мая 2011

В зависимости от размера вашего сайта (и уровня трафика) может возникнуть проблема с пропускной способностью. то есть onclick="add_table(this)" добавляет 24 байта данных к загрузке. Это может быть помещено в кэшированную страницу JavaScript, которая загружается только один раз, а не для каждого запроса. Если у вас много страниц с дополнительным кодом и у вас трафик много , это может привести к заметной разнице в пропускной способности.

...