5 полезных приемов

[akzhan]

1) Удаление элементов не всегда так просто. Например, для тэгов IMG для браузеров на основе WebKit надо чистить поле src, иначе изображение так и останется в памяти. Но при этом надо проверять, что мы не под Android, ибо там такая операция вызывает крах браузера.

2) в jQuery API нет ничего для таймеров.

5) Тут надо бы красным выделить код — пока не поддерживается в большинстве браузеров.

Ну и, конечно, синтаксическая подсветка не помешала бы. тэг source, атрибут lang.

[unnx]

В идеале надо вообще все свойства обнулить, перед обнулением объекта.

Кроссбраузерная версия 5-го примера осуществляется через __defineGetter__ и __defineSetter__

[unnx]

Как же так, в jQuery нет, а пост на Хабрахабре — есть? http://habrahabr.ru/blogs/jquery/42809/ Колдовство!

[Toy]

Это плагин!

[unnx]

А я разве сказал, что они не относятся к делу?

[kashey]

прием номер 1 загадочен и не верен.
Чтобы гарантированно уничтонить дом ноду достаточно сделать простые действия.
1. добавить ее в некий элемент
2. сказать этому самому родительскому элементу innerHTML=''
3. профит и полное изничтожение.
(это кстати рекомендованное поведение для IE)

[general]

Такое ощущение, что автор никогда не пытался прочитать ни одной книги по JavaScript. Методом тыка открыл для себя несколько не очевидных в начале решений, которые знают все, и решил поделится ими со всем миром.

Во-первых, в любой литературе по JavaScript, указывается как работают эти функции в разных браузерах и с каких версий поддерживаются. Реализаций JavaScript с ходу с десяток наберется.
Еще понравились введения в AJAX & try-catch.

Автор, я не могу поверить, что вы прочитали хотя-бы две книжки по JavaScript и там не было try-catch. Стоит ли писать статьи, если вы сами их никогда не читаете?

[Toy]

i = setInterval(abc(),3000)

А так разве будет работать корректно? Нужно ведь только передать имя функции, а не вызывать её тут же.

[Azy]

хотел это написать
но может у него
function abc() {
return function() {
alert('abc');
}
}

[Azy]

Зачем велосипед в п.3?
jQuery ajax/get/post никто не отменял еще

[serf]

Затем что некоторые разработчики считают что нужно понимать как все работает. И да jQuery далеко не стандарт JS разработки, я видел очень мало хорошего кода на jQuery, в основном поделки школьников.

[Azy]

Ну во-первых одно другому не мешает. Я для себя кучу интересных моментов открыл читая код jQuery.
А во-вторых jQuery уже по-большому счету стандарт. Пруф
В третьих, если у меня разработчик будет писать хрень подобную выше — огребет по полной, потому что бесцельно тратит рабочее время на выдумывание велосипеда.

[serf]

Я бы сказал что эти графики говорят только о росте деградации :)

[Azy]

Деградации? Можно посмотреть ваши проекты?

[serf]

Попробую объяснить свою позицию. jQuery популярен, и набирает обороты по понятной причине, низкий порог вхождения, им действительно просто пользоваться, для простых вещей, как раз по этим причинам качество кода и страдает.

Например, самое типичное порождение jQuery в том, что его пользователи (возможно и разработчики, некоторые) в своих плагинах получают селекторами нужные им элементы постоянно заново (иногда это доходит до абсурда), не задумываясь о том что их можно закешировать, также при этом запрос селектора никогда не выносится в константу.

Тем не менее я совсем не против jQuery, я не говорил что это плохой инструмент, а только о том какие плагины он пораждает. Я бы даже хотел использовать jQuery каждый день чтобы получить много хорошего опыты, так как заказчики любят эту библиотеку :)

[serf]

Кстати вот как раз по теме свежий перевод Фреймворки делают разработчиков тупыми?

[barmaley_exe]

В статью особо не вчитывался, поскольку она о Джаве, от которой я далёк и не знаю роли фреймворков в ней.
Но, по-моему, (для client-side и jQuery, в частности) проблема не столько во фреймворках, сколько в людях, пишущих на них. Фреймворки сильно снижают порог вхождения, скрывая сложность многих действий от пользователя. Взять, например, те же CSS селекторы в jQuery: если бы пользователь реализовывал выборку нужного элемента вручную (DOM traversing), он бы знал, чего это стоит браузеру и кешировал узлы в переменных вместо повторной выборки каждый раз.

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

[serf]

Это мое личное мнение, основанное на просмотре исходников многих jQuery плагинов, готов принять все минусы, потому как истина дороже :)

[serf]

И да, про код jQuery речи не было, если кто-то смотрит исходники используемых инструментов, то уже понятно что он разработчик, я лишь указываю на тенденцию.

[Busla]

Ради как-то примитивной интерактивности подключать jQuery тоже не совсем правильно.

[Azy]

У меня jQuery подключается во всех проектах на этапе создания, а не когда необходимость возникнет, потому что понадобится 100%.

[gradmax]

подключи еще ExtJS… вдруг Ext.direct'ом данные подгружать захочешь )

[kichik]

5. См. также defineProperty в ECMAScript 5

var obj = {};
 
Object.defineProperty( obj, "value", {
   value: true,
   writable: false,
   enumerable: true,
   configurable: true
 });

И относительно кроссбраузерности: kangax.github.com/es5-compat-table/ — все относительно.

[rudevich]

ад

[gro]

Приём N1: ну заменили вы локальную переменную на null и что?

[Voenniy]

var object = {aaa:"aaa", bbb:"bbb"};

function Kill(object) {
object.innerText = null;
object.innerHTML = null;
object.outerHTML = null;
object = null;
}

Kill(object);
alert(object);

Выдает object :(

[serf]

а что мешает вызвать delete object;

[barmaley_exe]

Ничто. Только зачем?

[TheShock]

а что мешает вызвать delete object;

Для локальных переменных сработает некорректно.

[mihaild]

По всей видимости, имелось ввиду, что последнее присваивание надо делать в месте вызова, а не в функции.
Впрочем, не совсем понятно, кто и когда запретил delete.

[gro]

delete по отношению к переменным запретила спецификация. Можно только к свойствам объекта.

[mihaild]

Вот он — понедельник во всей красе.

[serf]

Спасибо, кэп, что бы мы без тебя делали

[TheShock]

Кэп поддельный. Советы не очевидны, а вредны.

[serf]

Разумеется, это вообще какой-то джедайский путь

[lahmatiy]

Видимо вы не тестировали ваш код в браузерах. А еще видимо не понимаете как работает DOM, как «работают» объекты в браузере, как уничтожаются, что есть сборщик мусора и как он работает.
Вот вам код для экспериментов:

function Kill(object) {
object.innerText = null;
object.innerHTML = null;
object.outerHTML = null;
object = null;
}
var a = document.createElement('div');
a.className = 'asd';
var b = document.createElement('div');
b.appendChild(a);
alert(b.innerHTML);  // <div class="asd"></div>
Kill(a);
b.appendChild(a);  // (1) важная строка, я буду на нее ссылаться
alert(b.innerHTML);  // <div class="asd"></div>  
alert(a.outerHTML);  // (2) <div class="asd"></div>  

Вы кажется обещали полное уничтожение после вызова Kill? Так вот, как видите div, сохраненный в переменной a, жив здоров.
Учим мат часть:
1. Свойства innerHTML, innerText и outerHTML — это интерфейсные свойства для html элемента, это по сути getter'ы/setter'ы. Когда вы их меняете это приводит к определенным действиям со стороны браузера, он переводит все это в некие DOM операции.
2. innerText — нестандартное свойство, оно всегда было в IE, потом стало поддерживаться некоторыми другими браузерами, но его нет в стандарте. По сути операция чтения реализуется через выборку всех текстовых узлов и конкатенацию их значений (nodeValue), а запись — через экранирование данных и запись в innerHTML, либо же операциями DOM:

object.innerHTML = '';
object.appendChild(document.createTextNode(text));

Поэтому нет смысла обнулять innerHTML и innerText — достаточно обнулить innerHTML.
3. Свойства outerHTML тоже нет в стандарте. IE и webkit его поддерживают, но запись в свойство равносильно следующему:

function setOuterHTML(element, html){
  if (element.parentNode) // если нет родителя, операция бессмысленна
  {
    var fragment = document.createDocumentFragment();
    var tmp = document.createElement('div');
    tmp.innerHTML = html;
    while (tmp.lastChild)
      fragment.appendChild(tmp.lastChild);
    element.parentNode.replaceChild(fragment, element);
  }
}

То есть если элемент находится в другом элементе, то он замещается на новый html. При этом разрушения, как вы предполагали, не происходит — об этом говорит строка (1) — outerHTML не изменился, но да, элемент был изъят из своего родителя. По этой причине если убрать строку (2), то в родителе b элемента a не будет.
Но для изъятия узла из его родителя есть более простой способ:

  if (node.parentNode)
    node.parentNode.removeChild(node);

4. Свойств innerText и outerHTML нет в стандарте, так как они не атомарны, неоднозначны и относительно легко эмулируются. Firefox не поддерживает эти свойства, поэтому он не удалит элемент из другого как вы предполагаете, поэтому даже без строки (1) все останется на своих местах.
5. Задание значений свойствам DOM узла браузерно-зависимо. Подразумевается что innerHTML/outerHTML/innerText содержат текстовые значения, поэтому значения будет приводится к строке.

object.innerHTML = value;
// IE поймет это так
object.innerHTML = String(value);
// webkit
object.innerHTML = value == null ? '' : String(value);

Соответственно вместо пустого значения, в IE вы получите строку 'null'. При задании outerHTML = null, в IE вместо кода удаляемого узла будет 'null', в webkit пустая строка.
6. Особо «порадовало»:

function (object){
  ...
  object = null;
}

DOM это элемент, или переменная, все равно от объекта ничего не останется. Если, например, из функции убрать первые две строки, к объекту нельзя больше будет обратиться, но HTML элемент никуда не денется.

В js в функцию объекты передаются по ссылке. То есть object это всего лишь переменная, которая содержит ссылку на целевой объект. От ее обнуления ничего не изменится. Да, после того как вы обнулили переменную, внутри функции обратиться к объекту нельзя — но объект по прежнему существует и к нему можно обращаться, как можно увидеть из кода, который я привел.
Нет смысла внутри функции присваивать null для оbject, так как это и так произойдет на выходе из функции.
7. Чтобы уничтожить объект, нужно убрать все ссылки на него, тогда сборщик мусора сам разрушит объект. Если вы уверены что на узел не ссылаются переменные, достаточно сделать:

  if (node.parentNode)
    node.parentNode.removeChild(node);

[akzhan]

респект, разобрано по косточкам. плюс пример нюансов из первого моего комментария, для полноты, и RIP.

[Pozadi]

Вот ради таких комментариев и нужны такие посты.

[lahmatiy]

i = setInterval(abc(),3000)

Функции setInterval и setTimeout принимают качестве первого значения функцию (имя функции), либо строку.
В случае строки, ее значение конвертируется javascript.
В вашем примере abc видимо возвращает строку, либо функцию — так как она вызывается сразу, а не через 3 секунды. Хотя больше похоже на опечатку, и скобок здесь быть не должно.

[serf]

Автор, советую почитать книги (не блоги, не стать, не переводы) раз появилось желание разрабатывать на JS, начать с азбуки (синтаксис, возможности), потом всякие плюшки и приемы (развивает мыслительный процесс) — Stefanov, Zakas, Resig и тд.

[akzhan]

Автор уже вторую статью слабал, того же уровня :)

[lahmatiy]

Начать стоит с полезных статей на хабре, в которых уже собрали множество полезных советов и ответы на множество вопросов, где в том числе есть и ссылки на сопутствующие статьи:
JavaScript F.A.Q: Часть 1
JavaScript F.A.Q: Часть 2

[serf]

Не соглашусь, по моему начать следует с азбуки, по крайней мере автору. Приведенный FAQ полезен не отрицаю, но это все есть в приведенных книгах второго уровня.

[izharskiy]

Аффтару надо читать:

Название DOM Scripting: Web Design with JavaScript and the Document Object Model
Apress Series
Авторы Jeremy Keith, Jeffrey Sambells
Соавтор Jeffrey Sambells
Издание: 2
Издатель Apress, 2010
ISBN 1430233893, 9781430233893
Количество страниц Всего страниц: 336

там не про фреймворки
;-)

[izharskiy]

Alexei White?!

Название JavaScript Programmer's Reference
Автор Alexei White
Издатель John Wiley and Sons, 2010
ISBN 0470577843, 9780470577844

Только он почему-то оброс волосами и помолодел за год, судя по обложке, если сравнить её с изданием 2009 г.

[ainte]

> i = serInterval(function{код_здесь},3000)
serInterval — сэр Интервал?