Страница 2 из 3 < 1 2 3 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Помощь в изменении кода javascript (https://javascript.ru/forum/misc/49128-pomoshh-v-izmenenii-koda-javascript.html)

WorM32 31.07.2014 09:36
MallSerg,
не-не-не, я никогда бы не стал в цикле использоваться конструкцию с el.innerHTML += 'бла бла бла';

Если на вашем примере, то было бы так:
<!Doctype html>
<html>
<head>
    <meta charset="utf-8">
	<style>
b {marginLeft:2pt;}
	</style>
</head>
<body>
<div id="first">test 1 </div>
<div id="second">test 2</div>
<script type="text/javascript">
   var f = document.getElementById("first");
   var s = document.getElementById("second");   var r;
 
var html = f.innerHTML;
var time1 = new Date().getTime();  
  for (i = 0 ; i < 1000; ++i){
	html += "<b>A da</b>";
  }
f.innerHTML = html;
var time2 = new Date().getTime();
  
var time3 = new Date().getTime();  
  for (i = 0 ; i < 1000; ++i){
	r = document.createElement ("b");
	r.innerHTML = "A da";
	s.appendChild (r);
  }
var time4 = new Date().getTime();    

alert ("(innerHTML +=)милисек = " + (time2 - time1) );
alert ("(appendChild)милисек = " + (time4 - time3) );
alert ("коффицент" + ((time2 - time1) / (time4 - time3)) );
</script>
</body>
</html>

Aetae 31.07.2014 09:46
WorM32, ты бы не стал. А те, кому ты советы даёшь без пояснений - стали бы. Потому хотябы в ответах новичкам воздержись от этого дерьма.

WorM32 31.07.2014 09:56
Aetae,
Простите, но пояснения, что "нужно использовать только appendChild и всё, писец!" - я тоже не увидел) Так что в данном случае ваш совет ничем не лучше моего.

А вообще нужно уметь пользоваться разными инструментами, в зависимости от конкретной ситуации, но это придет только с опытом.

MallSerg 31.07.2014 10:03
WorM32,
Ты лукавишь речь шла про то что « .innerHTML += » это писец
а ты переврал и убрал эту конструкцию из своего теста и пытаешься всех обмануть.
Не нада так делать.

Нужно просто признать что « .innerHTML += » именно в таком сочетании это писец ад и погибель

WorM32 31.07.2014 10:23
MallSerg,
Простите, где это я из своего теста убрал полный ребилд элемента? Ведь именно в этом и был смысл нашего спора с Aetae.

Конструкции
var html = el.innerHTML;
html += '<b>bla</b>';
el.innerHTML = html;
и
el.innerHTML += '<b>bla</bla>';
Являются идентичными! И делают полный ребилд элемента el.

Про то что el.innerHTML += 'bla' можно использовать в цикле я нигде не говорил, и у ТСа в описании проблемы тоже не было никаких циклов. Так что не надо фантазировать и подгонять тесты под свои фантазии.

same4 31.07.2014 10:56
Aetae,

Спасибо большое, вы сделали мой день. И да, вы может упустили момент, но мне нужно отправлять текст по нажатию на enter, сейчас же страница тупо обновляется.

Да, спасибо всем, кто помог мне в решении проблемы. Все ваши ответы послужат мне уроком :)

В моем случае, код - Aetae был тем, что мне нужно.

MallSerg 31.07.2014 11:00
Цитата:
Сообщение от same4
В моем случае, код - Aetae был тем, что мне нужно.
халявой?

same4 31.07.2014 11:03
Цитата:
Сообщение от MallSerg (Сообщение 323558)
халявой?
Да, правильно подмечено.

WorM32 31.07.2014 11:08
Rise,
<!Doctype html>
<html>
<head>
    <meta charset="utf-8">
	<style>
b {marginLeft:2pt;}
	</style>
</head>
<body>
<div id="first">test 1 <b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b><b>A da</b></div>
<div id="second">test 2</div>
<script type="text/javascript">
   var f = document.getElementById("first");
   var s = document.getElementById("second");   var r;
 
var html = f.innerHTML;
var time1 = new Date().getTime();  
  for (i = 0 ; i < 1000; ++i){
	html += "<b>A da</b>";
  }
f.innerHTML = html;
var time2 = new Date().getTime();
  
var time3 = new Date().getTime();  
  for (i = 0 ; i < 1000; ++i){
	r = document.createElement ("b");
	r.innerHTML = "A da";
	s.appendChild (r);
  }
var time4 = new Date().getTime();    

alert ("(innerHTML +=)милисек = " + (time2 - time1) );
alert ("(appendChild)милисек = " + (time4 - time3) );
alert ("коффицент" + ((time2 - time1) / (time4 - time3)) );
</script>
</body>
</html>


Еще вопросы?

WorM32 31.07.2014 11:29
Цитата:
Сообщение от Rise (Сообщение 323566)
Что это? Тест сложения строк?
это ответ на
Цитата:
Сообщение от Rise (Сообщение 323552)
У ТС при добавлении команд будет увеличиваться содержимое элемента output, при innerHTML браузеру с каждым разом придется извлекать(преобразовать dom в строку), создавать заново(строку в dom) структуру содержимого из большего числа элементов.
И тест показывает, что для конкретного случая, прироста производительности от использования appendChild нет!


Часовой пояс GMT +3, время: 09:50.
Страница 2 из 3 < 1 2 3 >
Показывать 40 сообщений этой темы на одной странице