Форум

neWjs · #21 (**permalink**) 07.07.2012, 23:31

так та часть за комментирована.

Deff · #22 (**permalink**) 07.07.2012, 23:39

neWjs,
1. Сложно разбираться в скриптах без структуры
2. На jQuery данный поиск - 7 строк кода
3. Начните с алгоритма - слишком заморочено неясно внешнему наблюдателю

Там действий то нет никаких
1. Ввели строку кода - ищем в элементе с текстом при нахождении обрамляем в теги со специфическим классом
2. При повторном запросе
a) Изымаем все теги с данным классом
b) Повторяем пункт 1
Вот эту группу функций отделяем и обрамляем в отдельную функцию

.....

Deff · #23 (**permalink**) 07.07.2012, 23:40

Ваш текущий, неправленный код -

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <title>Документ без названия</title>
      <style>
.finded {
	background-color:#FF6;
	}
.fixed {
	position:fixed;
	left:45%;
	top:45%;
	border:2px dashed #00FF00;
	
	}
.bag {
	
	background-color:#CCC;
	opacity:.6;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	}	
.form {
	position:relative;
	z-index:10;}	
</style>
    </head>
    <body>
      <div class="fixed">
        <div class="bag"></div>
        <div class="form">
          

введите текст для поиска 
          <br>
          <input type="text" id="search">
          <br>
          <input type="button" onclick="cl.call(this);" id="find_s" value="поиск">
          <br>
          <a href="#1" id="next_anc">след</a>
          <a href="#1" id="prev_anc">пре</a>
        </div>
      </div>
      <img id="im" src="twitter-follow-achiever.jpg">
      

Реферат по физике
Тема: «Плазменный экситон: основные моменты»
Погранслой нейтрализует эксимер, но никакие ухищрения экспериментаторов не позволят наблюдать этот эффект в видимом диапазоне. Экситон, в рамках ограничений классической механики, отталкивает плоскополяризованный резонатор независимо от расстояния до горизонта событий. Неустойчивость, как известно, быстро разивается, если колебание испускает кварк - все дальнейшее далеко выходит за рамки текущего исследования и не будет здесь рассматриваться. Зеркало изотропно возбуждает электрон только в отсутствие тепло- и массообмена с окружающей средой. Тело отталкивает ультрафиолетовый газ, в итоге возможно появление обратной связи и самовозбуждение системы. Плазменное образование мономолекулярно нейтрализует торсионный лазер по мере распространения сигнала в среде с инверсной населенностью.

Разрыв, как можно показать с помощью не совсем тривиальных вычислений, устойчив в магнитном поле. Сингулярность, вследствие квантового характера явления, трансформирует плоскополяризованный бозе-конденсат вне зависимости от предсказаний самосогласованной теоретической модели явления. Зеркало, при адиабатическом изменении параметров, неупруго. Течение среды квазипериодично заряжает торсионный квазар при любом агрегатном состоянии среды взаимодействия. В литературе неоднократно описано, как бозе-конденсат масштабирует квантовый фотон, тем самым открывая возможность цепочки квантовых превращений. Экситон, как неоднократно наблюдалось при постоянном воздействии ультрафиолетового облучения, изотропно ускоряет бозе-конденсат только в отсутствие тепло- и массообмена с окружающей средой.

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

      <div>
        <h1>Земля</h1>
        
Земля́ — третья от Солнца планета Солнечной системы, крупнейшая по диаметру, массе и плотности среди планет земной группы.
Чаще всего упоминается как Мир, Голубая планета[1][2], иногда Терра (от лат. Terra). Единственное известное человеку на данный момент тело Солнечной системы в частности и Вселенной вообще, населённое живыми существами.
Научные данные указывают на то, что Земля образовалась из Солнечной туманности около 4,54 миллиардов лет назад,[3][4][5][6] и вскоре после этого приобрела свой единственный естественный спутник — Луну. Жизнь появилась на Земле около 3,5 миллиардов лет назад. С тех пор биосфера Земли значительно изменила атмосферу и прочие абиотические факторы, обусловив количественный рост аэробных организмов, так же как и формирование озонового слоя, который вместе с магнитным полем Земли ослабляет вредную солнечную радиацию, тем самым сохраняя условия для жизни на Земле. Учитывая период полураспада радиоактивных элементов, радиация, обусловленная самой земной корой, снизилась ещё более значительно. Кора Земли разделена на несколько сегментов, или тектонических плит, которые постепенно мигрируют по поверхности за периоды во много миллионов лет. Приблизительно 70,8 % поверхности планеты занимает Мировой океан[7], остальную часть поверхности занимают континенты и острова. Жидкая вода, необходимая для всех известных жизненных форм, не существует на поверхности какой-либо из известных планет и планетоидов Солнечной системы, кроме Земли. Внутренние области Земли достаточно активны и состоят из толстого, очень вязкого слоя, называемого мантией, которая покрывает жидкое внешнее ядро (которое и является источником магнитного поля Земли) и внутреннее твёрдое ядро, предположительно, железное.
      </div>
      <script>
//(function(){
	var next_,search_,inp_s, inp_bt, prev_val, next_anc,prev_anc;
	
	 next_ = document.body.firstChild;
	 inp_s = document.getElementById("search");  
	 inp_bt = document.getElementById("find_s"); 
	 next_anc = document.getElementById('next_anc');
	 prev_anc = document.getElementById("prev_anc");
	/* 
	 next_anc.onclick = function(){fin.call(this,'next');}
	  prev_anc.onclick = function(){fin.call(this,'prev');}*/
	   

		   
		  function cl (){
 
			search_ = inp_s.value;	

	 
			alert("asds="+inp_s.value);
		   if(search_ === prev_val || search_ == '')return;
		    
			setTimeout(return_back,0);
		     setTimeout(cls,0);
			
			prev_val = search_;
			  } 
		   
		/*   var j = 1;
		  function fin(param){
			//var fin = document.anchors;
			 // var len = fin.length;
			  alert();
			   if(param == 'next')j++;
			   else j--;
			  
			   this.href = '#'+j;
			 
			  } */
	   
	    function cls(){
		 var inner;
		
		 function search_condition(next){
		    
			 var n_type = next.nodeType;	 
			   var tag = next.tagName;
			  
			  if(tag =='SCRIPT'|| tag == 'STYLE'
			  || tag =="IMG" || tag == 'BR'
			   || tag =="INPUT" || next == inp_s.parentNode
			   || next == inp_s ) return false;
			  
			  if(n_type === 1){
				  inner = "innerHTML";
				    if(next[inner] === '')return false;
				  }
				  
			  if(n_type === 3){
				   inner = "data";
			
				   if(next[inner] == '\n')return false;
					   
					   
				  }	 
				
			 return true;
			 }
			 
			 var i = 0;
		   (function closers(){
			if(search_condition(next_)){
			 var reg = new RegExp(search_,"ig");  
			next_[inner] = next_[inner].replace(reg, function(fin){
			i++;	
			return '&lt;span name="'+i+'" class = "finded">'+fin+"&lt;/span>";
			});
			 }
		 
		 next_ = next_.nextSibling;
		 if(next_ !== null){
			 setTimeout(closers);
		} else {
			next_ = document.body.firstChild;
		     i = 0;
		}
	
		  }());
		
		   
		 	};
	
	function return_back (){
		
		var finded_el = document.getElementsByClassName("finded");
		  console.log(finded_el);
		  var el, text,el_parent; 
		for(var i = finded_el.length;i--;){
			
			el = finded_el[i];
			
			 el_parent = el.parentNode;
			  text = el.innerHTML;
			
			el.insertAdjacentHTML("afterEnd",text);
			  el_parent.removeChild(el);
			}
		}
	    
	//}());

</script>
    </body>
  </html>

neWjs · #24 (**permalink**) 07.07.2012, 23:59

вот код убрал лишнее(комментарии)

var next_, search_,inp_s, inp_bt, prev_val, next_anc,prev_anc;
	
	 next_ = document.body.firstChild;
	 inp_s = document.getElementById("search");  
	 inp_bt = document.getElementById("find_s"); 
	 next_anc = document.getElementById('next_anc');
	 prev_anc = document.getElementById("prev_anc");



        function cl (){//вызывается кликом по кнопки с value= поиск
	            search_ = inp_s.value;		  
			alert(inp_s.value);
		   if(search_  === prev_val || search_  == '')return;
		     
			setTimeout(return_back,0);
		     setTimeout(cls,0);
			
			prev_val = search_;
			  } 


	    function cls(){//основная функция внутри которой рекурсия
		 var inner;
		 
		 function search_condition(next){//функция проверки элемента 
		    
			 var n_type = next.nodeType;	 
			   var tag = next.tagName;
			  
			  if(tag =='SCRIPT'|| tag == 'STYLE'
			  || tag =="IMG" || tag == 'BR'
			   || tag =="INPUT" || next == inp_s.parentNode
			   || next == inp_s ) return false;//проверка на теги в которых не нужно искать
			  
			  if(n_type === 1){//проверка на тэг
				  inner = "innerHTML";
				    if(next[inner] === '')return false;
				  }
				  
			  if(n_type === 3){// проверка на текстовый узел
				   inner = "data";
			
				   if(next[inner] == '\n')return false;
					   
					   
				  }	 
				
			 return true;// если элемент отвечает условию то в нем будет производится поиск
			 }
			
			 var i = 0;// номер якоря
		   
                     (function closers(){//замыкание
			  console.log(search_)
			if(search_condition(next_)){// проверка результата функции выше
			
                        var reg = new RegExp(search_,"ig");  
			next_[inner] = next_[inner].replace(reg, function(fin){// поиск и замена в данном элементе(если нашло подходящую фразу)
			i++;	
			return '<span name="'+i+'" class = "finded">'+fin+"</span>";
			});
			 }
		 
		 next_ = next_.nextSibling;// переход к следующему элементу
		 if(next_ !== null){// проверка последний элемент или нет
			 setTimeout(closers);
		} else {
			next_ = document.body.firstChild;// когда страница пройдена сбрасуем значения
		     i = 0;
		}
	
		  }());
		
		   
		 	};
	
	function return_back (){
		
		var finded_el = document.getElementsByClassName("finded");
		  console.log(finded_el);
		  var el, text,el_parent; 
		for(var i = finded_el.length;i--;){
			
			el = finded_el[i];
			
			 el_parent = el.parentNode;
			  text = el.innerHTML;
			
			el.insertAdjacentHTML("afterEnd",text);
			  el_parent.removeChild(el);
			}
		}

Deff · #25 (**permalink**) 08.07.2012, 00:14

neWjs,
а зачем рекурсия - там один проход функцией в replace ?
Зачем лишнее по исключению формы ?
Форму поиска перенесите ниже(или выше) боди(потом отцентрируете css по центру экрана) - поиск осуществлять в body
И вообще - Почему поисковый контент не заключен весь в общий тег div ? к примеру div id="pun-main"

Ни разу не видел сайтов с контентом без обрамлений

neWjs · #26 (**permalink**) 08.07.2012, 00:17

Сообщение от Deff

neWjs,
а зачем рекурсия - там один проход функцией в replace ?
Зачем лишнее по исключению формы ?
Форму поиска перенесите ниже(или выше) боди(потом отцентрируете css по центру экрана) - поиск осуществлять в body
И вообще - Почему поисковый контент не заключен весь в общий тег div ? к примеру div id="pun-main"

Ни разу не видел сайтов с контентом без обрамлений

т.е лучше убрать проверку на текстовый узел?

Deff · #27 (**permalink**) 08.07.2012, 00:20

Сообщение от neWjs

т.е лучше убрать проверку на текстовый узел?

Я думаю
1. Нормально оформить и согласовать страницу с руководством - тады работ сократицо в два раза

2. Вынести форму за обрамление с проверяемым текстом и отпозиционировать её css

neWjs · #28 (**permalink**) 08.07.2012, 00:28

да вы правы , с проверкой я переборщил=)
убрал , но теперь вообще какой то бред функция не вызывается (хотя вызов есть) setTimeout(s_rch,0); (я переименовал ее на s_rch)

var next_, search_, inp_s, inp_bt, prev_val;
	
	 next_ = document.body.firstChild;
	 inp_s = document.getElementById("search");  
	 inp_bt = document.getElementById("find_s"); 
	 
	    function cl (){
			  search_ = inp_s.value;
			alert(inp_s.value);
		   if(inp_s.value_ === prev_val || inp_s.value == '')return;
		     
			setTimeout(return_back,0);
		     setTimeout(s_rch,0);
		
			prev_val = search_;
			  } 
			 
		   
		  function s_rch(){
		 alert(next_);
		 function search_condition(next){
		    
			 var n_type = next.nodeType;	 
			   var tag = next.tagName;
			  
			  if(tag =='SCRIPT'|| tag == 'STYLE'
			  || tag =="IMG" || tag == 'BR'
			   || tag =="INPUT" ) return false;
			     return true;
			 }
			 
			
			 var i = 0;
		   (function closers(){
			 
			 if(search_condition(next_)){
			 
			 var reg = new RegExp(search_,"ig");  
			
			next_.innerHTML = next_.innerHTML.replace(reg, function(fin){
			i++;	
			return '<span name="'+i+'" class = "finded">'+fin+"</span>";
			});
			 }
		 
		 next_ = next_.nextSibling;
		 if(next_ !== null){
			 setTimeout(closers);
		} else {
			next_ = document.body.firstChild;
		     i = 0;
		}
	
		  }());
		
		   
		 	};
	
	function return_back (){
		
		var finded_el = document.getElementsByClassName("finded");
		  
		  var el, text,el_parent; 
		for(var i = finded_el.length;i--;){
			
			el = finded_el[i];
			
			 el_parent = el.parentNode;
			  text = el.innerHTML;
			
			el.insertAdjacentHTML("afterEnd",text);
			  el_parent.removeChild(el);
			}
		}

Deff · #29 (**permalink**) 08.07.2012, 00:31

neWjs,
а я не понял этого изврата
12 setTimeout(return_back,0);
13 setTimeout(s_rch,0);

почему не просто s_rch () ?

2. Для мозиллы желательно все описания вызываемых функций ставить раньше вызова

neWjs · #30 (**permalink**) 08.07.2012, 00:39

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

Форум

Справочник

Discord чат

Курсы javascript