Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.05.2014, 12:25
Интересующийся
Отправить личное сообщение для JaneLane Посмотреть профиль Найти все сообщения от JaneLane
 
Регистрация: 19.04.2014
Сообщений: 13

проход по узлам DOM
Здравствуйте!Есть таблица, в которую можно добавлять и удалять строки,присоединяю и удаляю узлы методами appendChild и removeChild,idшники элементов идут не по порядку.есть ли какая-нибудь возможность пройти по уже заполненной таблице и проставить правильный порядок строк?
Ответить с цитированием
  #2 (permalink)  
Старый 04.05.2014, 12:34
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

JaneLane,
а какая проблема с сортировкой?
Ответить с цитированием
  #3 (permalink)  
Старый 04.05.2014, 12:53
Интересующийся
Отправить личное сообщение для JaneLane Посмотреть профиль Найти все сообщения от JaneLane
 
Регистрация: 19.04.2014
Сообщений: 13

рони,у меня разбиения в самих строках еще есть,нужно оставить такой же порядок строк,только как-то пройтись по узлам в этом порядке и назначить правильный номер
Ответить с цитированием
  #4 (permalink)  
Старый 04.05.2014, 12:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

JaneLane,
пример html -- что было - что нужно - иначе вас сложно понять.
Ответить с цитированием
  #5 (permalink)  
Старый 04.05.2014, 13:24
Интересующийся
Отправить личное сообщение для JaneLane Посмотреть профиль Найти все сообщения от JaneLane
 
Регистрация: 19.04.2014
Сообщений: 13

рони,
function newSubject(dayN,discN,fieldName,tmp)
	{   

	a=document.getElementsByTagName("input");
	for (i=0;i<a.length;i++)
	{
		var obj=a.item(i);
		var oname=obj.name;
		if (oname==fieldName) 
		{	
			
			obj.value++;
	
	

        var divTr=document.getElementById("tr_"+dayN+"_"+0);
	newDivTr=divTr.cloneNode(true);
 	newDivTr.id="tr_"+dayN+"_"+obj.value;

	newDivTr.childNodes[1].name="hiddenNumber_"+dayN+"_"+obj.value;
	alert(newDivTr.childNodes[1].name);
        

	var discN=obj.value;
	
	alert(tmp);
	var objSel=document.getElementById(tmp);
	var selTd= objSel.parentNode.parentNode;

	var row=selTd.parentNode;

	var nmb=tmp.charAt(tmp.length-1);
	                                      
	
	var weekDiv=document.createElement("div");
	var subgroupDiv=document.createElement("div");
	var bothDiv=document.createElement("div");



	

	var cnclB=document.createElement("button");
	cnclB.id="cncl_"+dayN+"_"+discN;
	var txtC=document.createTextNode("Отменить разбиение");
	cnclB.appendChild(txtC);

	var objSel=document.getElementById(tmp);

        var addB=document.createElement("button");
	addB.id="add_"+dayN+"_"+discN;
	var txtA=document.createTextNode("Добавить подгруппу");
	addB.appendChild(txtA);




		        
		
	 if ( objSel.selectedIndex != -1)
	{
    
         var br=document.createElement("br");

		if ( objSel.selectedIndex == 1)
		{
		
		var lbl=document.createTextNode("расписание по неделям");

		weekDiv.appendChild(lbl);
		weekDiv.appendChild(br);
		weekDiv.appendChild(cnclB);
		show(weekDiv);
		selTd.appendChild(weekDiv);
		setEvent(cnclB,"click",function(){delSubject(dayN,discN,fieldName);

		show(objSel);objSel.selectedIndex=-1;
		hide(weekDiv);});
	
		hide(objSel);
		
	
		

		}

		else if ( objSel.selectedIndex == 2)

		{
		var lbl=document.createTextNode("расписание по подгруппам");
		subgroupDiv.appendChild(lbl);
		subgroupDiv.appendChild(br);
		subgroupDiv.appendChild(addB);
		subgroupDiv.appendChild(cnclB);
		show(subgroupDiv);
                selTd.appendChild(subgroupDiv);

		setEvent(cnclB,"click",function(){delSubject(dayN,discN,fieldName);
		discNN=discN-1;
		alert(discNN);
		cnclB.id="cncl_"+dayN+"_"+discNN;
		addB.id="add_"+dayN+"_"+discNN;
		discN=discNN;
		var lastC=cnclB.id.charAt(cnclB.id.length-1);
		if (nmb==(lastC))
		{
			show(objSel);objSel.selectedIndex=-1;
			hide(subgroupDiv);
		}
		
		;});
				

		setEvent(addB,"click",function(){newSubject(dayN,discN,fieldName,tmp);
		selTd.removeChild(subgroupDiv);		
});
		
	
		hide(objSel);
		

		


	
	
		}

		else if ( objSel.selectedIndex == 3)
		{
		var lbl=document.createTextNode("расписание для подгрупп по верхней неделе(по нижней наоборот)");

		bothDiv.appendChild(lbl);
		bothDiv.appendChild(br);
		bothDiv.appendChild(cnclB);
		show(bothDiv);
	
		selTd.appendChild(bothDiv);
		setEvent(cnclB,"click",function(){delSubject(dayN,discN,fieldName);
		show(objSel);objSel.selectedIndex=-1;
		hide(bothDiv);});

		
		hide(objSel);
		
	
	

 		}

	

	 } 
	
	
	
	
	var hidStart=document.getElementById("hidStart_"+dayN+"_"+nmb);
	var newHidStart=hidStart.cloneNode(true);
	newHidStart.id="hidStart_"+dayN+"_"+obj.value;
	node01=newHidStart.childNodes[1];
	node01.name="hiddenStartTime_"+dayN+"_"+obj.value;


	
	


        var idTeacher=document.getElementById("idTeach_"+dayN+"_"+nmb);
	var newIdTeacher=idTeacher.cloneNode(true);
	newIdTeacher.id="idTeach_"+dayN+"_"+obj.value;
	node02=newIdTeacher.childNodes[1];
	node02.name="idTeacher_"+dayN+"_"+obj.value;
	                                       

                                                             	

        var start=document.getElementById("start_"+dayN+"_"+nmb);
	var newStart=start.cloneNode(true);
	newStart.id="start_"+dayN+"_"+obj.value;
	node1 = newStart.childNodes[1];
	node1.name="startTime_"+dayN+"_"+obj.value;


		

	start.parentNode.appendChild(newStart);
	start.parentNode.appendChild(newHidStart);
	start.parentNode.appendChild(newDivTr);

	

	
	var durat=document.getElementById("durat_"+dayN+"_"+nmb);
	var newDurat=durat.cloneNode(true);
	newDurat.id="durat_"+dayN+"_"+obj.value;
      	node2 = newDurat.childNodes[1];
	node2.name="duration_"+dayN+"_"+obj.value;
	durat.parentNode.appendChild(newDurat);
	



	var subg=document.getElementById("subg_"+dayN+"_"+nmb);
	var newSub=subg.cloneNode(true);
	newSub.id="subg_"+dayN+"_"+obj.value;
	node3 = newSub.childNodes[1];
	node3.name="subgroup_"+dayN+"_"+obj.value;
	subg.parentNode.appendChild(newSub);
	
	

	var type=document.getElementById("type_"+dayN+"_"+nmb);
	var newType=type.cloneNode(true);
	newType.id="type_"+dayN+"_"+obj.value;
	node4 = newType.childNodes[1];
	node4.name="subjectType_"+dayN+"_"+obj.value;
	type.parentNode.appendChild(newType);
	

                                              
	var subj=document.getElementById("subj_"+dayN+"_"+nmb);
	var newSubj=subj.cloneNode(true);
	newSubj.id="subj_"+dayN+"_"+obj.value; 
	inp=newSubj.childNodes[1].childNodes[1].childNodes[1];   
	inp.name="subject_"+dayN+"_"+obj.value;
	combo=newSubj.childNodes[1];
	combo.id="city_combo_"+dayN+"_"+obj.value;
	subj.parentNode.appendChild(newSubj);



	
	var teach=document.getElementById("teach_"+dayN+"_"+nmb );
	var newTeach=teach.cloneNode(true);
	newTeach.id="teach_"+dayN+"_"+obj.value;
	var divv = newTeach.childNodes[1];
	divv.id= "teacher_combo_"+dayN+"_"+obj.value;
	var inpp=divv.childNodes[1];
  	
	inpp.childNodes[3].name="teacher_"+dayN+"_"+obj.value;
	inpp.childNodes[1].name="tE_"+dayN+"_"+obj.value;
	var divv2= divv.childNodes[7]; 
       	node = divv2.childNodes[1];

 	
	node.name="teacher_list_"+dayN+"_"+obj.value;
	node.id="select_1_"+dayN+"_"+obj.value;

	teach.parentNode.appendChild(newTeach);
	teach.parentNode.appendChild(newIdTeacher);



	var room=document.getElementById("room_"+dayN+"_"+nmb);
	var newRoom=room.cloneNode(true);
	newRoom.id="room_"+dayN+"_"+obj.value;
	node7 = newRoom.childNodes[1];
	node7.name="room_"+dayN+"_"+obj.value;
	room.parentNode.appendChild(newRoom);



	var comm=document.getElementById("comm_"+dayN+"_"+nmb);
	var newComm=comm.cloneNode(true);
	newComm.id="comm_"+dayN+"_"+obj.value;
	node8 = newComm.childNodes[1];
	node8.name="comment_"+dayN+"_"+obj.value;
	comm.parentNode.appendChild(newComm);



	var cop=document.getElementById("cop_"+dayN+"_"+nmb);
	var newCop=cop.cloneNode(true);
	newCop.id="cop_"+dayN+"_"+obj.value;
	node9 = newCop.childNodes[1];
	node9.name="copy_"+dayN+"_"+obj.value;
	node9.id="copyB_"+dayN+"_"+obj.value;
	node9.removeAttribute("onclick");
	cop.parentNode.appendChild(newCop);




	var past=document.getElementById("past_"+dayN+"_"+nmb);
	var newPast=past.cloneNode(true);
	newPast.id="past_"+dayN+"_"+obj.value;
	node10 = newPast.childNodes[1];
	node10.name="paste_"+dayN+"_"+obj.value;
	node10.id="pasteB_"+dayN+"_"+obj.value;
	node10.removeAttribute("onclick");
	past.parentNode.appendChild(newPast);



	var cl=document.getElementById("cl_"+dayN+"_"+nmb);
	var newCl=cl.cloneNode(true);
	newCl.id="cl_"+dayN+"_"+obj.value;
	node11 = newCl.childNodes[1];
	node11.name="clear_"+dayN+"_"+obj.value;
	node11.id="clearB_"+dayN+"_"+obj.value;
	node11.removeAttribute("onclick");
	cl.parentNode.appendChild(newCl);



	var butt1=document.getElementById("butt1_"+dayN+"_"+nmb);
	var newButt1=butt1.cloneNode(true);
	newButt1.id="butt1_"+dayN+"_"+obj.value;
	node12 = newButt1.childNodes[1];
	node12.name="timeout_"+dayN+"_"+obj.value;
	node12.id="timeB_"+dayN+"_"+obj.value;
	node12.removeAttribute("onclick");
	butt1.parentNode.appendChild(newButt1);


    	

	
	            



	var cp=document.getElementById("copyB_"+dayN+"_"+obj.value);
	var ps=document.getElementById("pasteB_"+dayN+"_"+obj.value);
	var cl=document.getElementById("clearB_"+dayN+"_"+obj.value);
	var time=document.getElementById("timeB_"+dayN+"_"+obj.value);
	

	setEvent(cp,"click",function(){copyTask(dayN,discN);});
	setEvent(ps,"click",function(){pasteTask(dayN,discN);});
	setEvent(cl,"click",function(){clearLine(dayN,discN);});
	setEvent(time,"click",function(){timebreak(dayN,discN);});

 }
}


	
}


в html код первой строки таблицы,есть функция, которая добавляет новую строку в конец и которая выше-добавляет узлы в имеющуюся строку.Хочу пронумеровать заполненные строки по порядку,можно это сделать без сортировки?
Ответить с цитированием
  #6 (permalink)  
Старый 04.05.2014, 13:43
Профессор
Отправить личное сообщение для jsnb Посмотреть профиль Найти все сообщения от jsnb
 
Регистрация: 15.03.2014
Сообщений: 561

Сообщение от JaneLane Посмотреть сообщение
в html код первой строки таблицы,есть функция, которая добавляет новую строку в конец и которая выше-добавляет узлы в имеющуюся строку.Хочу пронумеровать заполненные строки по порядку,можно это сделать без сортировки?
Так и не понятно, что именно вам надо... Надо пронумеровать какие-то столбцы по порядку? Или изменить атрибуты? Или что? В любом случае что мешает просто пройти по DOM таблицы и сделать всё как надо? Что-нить типо этого:
<!DOCTYPE HTML>
<html>
  <head>
  <meta charset="utf-8">
  </head>
  <body>
<table id="test">
  <tr><th>ID</th><th>Something</th><th>del</th></tr>
  <tr><td>1</td><td>aaa</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>2</td><td>bbb</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>3</td><td>ccc</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>4</td><td>ddd</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>5</td><td>eee</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>6</td><td>ggg</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
</table>
<button onclick="renameID()">click</button>
<script>
function removeRow(td) {
  var row = td.parentNode;
  row.parentNode.removeChild(row);
}

function renameID() {
  var tableRows = document.querySelectorAll('#test tr');
  for(var i = 1; i < tableRows.length; i++) tableRows[i].children[0].innerHTML = i;  
}
</script>

  </body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 04.05.2014, 16:57
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

jsnb,
Вариант renameID()
<!DOCTYPE HTML>
<html>
  <head>
  <meta charset="utf-8">
  </head>
  <body>
<table id="test">
  <tr><th>ID</th><th>Something</th><th>del</th></tr>
  <tr><td>1</td><td>aaa</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>2</td><td>bbb</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>3</td><td>ccc</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>4</td><td>ddd</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>5</td><td>eee</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
  <tr><td>6</td><td>ggg</td><td><a href="#" onclick="removeRow(this.parentNode)">del</a></td></tr>
</table>
<button onclick="renameID()">click</button>
<script>
function removeRow(td) {
  var row = td.parentNode;
  row.parentNode.removeChild(row);
}

function renameID() {
  var tds = document.querySelectorAll('#test tr td:nth-child(1)');
  for(var i = 0; i < tds.length; ) tds[i].innerHTML = ++i;
}
</script>

  </body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
инициализация плагинов до вставки html-я в DOM FanAizu jQuery 3 19.01.2014 01:16
Получить список ВСЕХ элементов DOM Почемучкин Events/DOM/Window 7 16.04.2012 11:33
IE баг со скоростью обработки DOM Rootpassword Events/DOM/Window 2 13.02.2012 18:16
Новый элемент отсутствует в DOM модели StrSprut jQuery 4 19.09.2011 12:50
Как в браузерах реализуются функции DOM (например createElement) iamme Общие вопросы Javascript 7 02.09.2011 20:26