Почему HTML() срабатывает всего один раз, а BEFORE() хоть сколько?

Question

[maxefect]

Была задача добавить элемент на страницу, да так, чтобы кроссбраузерно.
Вот, например:
$('#oneImage').click(function(){
var a = $('body').html();
$('body').html(a + '');
});

этот вариант только реагирует на первый клик + кроссбраузерный

$('#oneImage').click(function(){
$('body').before('');
});
Реагирует адекватно на клики, добавляет сколько угодно .. но не работает в IE7, то есть не кроссбраузерный метод ...

Что не так с html() методом?

Answer 1

[Иван Старков]

Все с html() так :-) вы заменяете тело body
А вообще я в статистике давно не встречал ie7 пользователей, да и тут их рисуют www.w3schools.com/browsers/browsers_explorer.asp осталось 0.4%, поэтому может вы немного измените свои представления о кроссбраузерности, например c ie8

Comments

[Юрий Лобанов]

нононо, статистика для всего интернета - это не статистика для конкретного сайта. Я вот ie6 поддерживать буду.

[Иван Старков]

я нет :-) нафига мне эти муки

[Юрий Лобанов]

@icelaba ну значит Вы не знаете, где Китай )

Answer 2

[Юрий Лобанов]

html работает только один раз потому, что Вы делаете коряво.
Вы навесили на Ваш id событие клика, а потом Вы этот элемент перестраиваете. Зачем Вы копируете весь html внутри тега body, ограничьтесь каким-нибудь одним элементом, внутри которого не будет находиться Вашего id.
Пример

<a href="#" class="link">click</a>
<div class="in">
</div>

$('.link').click(function(){
var a = $('.in').html();
$('.in').html(a + 'любой контент');
});

Будет работать сколько угодно долго.
Или навешивайте событие клика методом on.
Тогда куда угодно пихайте ссылку, по которой кликаете.

$(document).on('click', '.link', function(){
 //
});

Answer 3

[maxefect]

на id нельзя вешать?

Comments

[Юрий Лобанов]

да без разницы. Просто в наше время использовать id для таких случаев неправильно

Answer 4

[Юрий Лобанов]

НУ и собственно ответ на Ваш вопрос: в before Вы не перестраиваете элемент, на который навешали клик.