Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.07.2009, 18:57
Аватар для HelpeR
Профессор
Отправить личное сообщение для HelpeR Посмотреть профиль Найти все сообщения от HelpeR
 
Регистрация: 21.10.2008
Сообщений: 241

переписать таблицу
Здравствуйте!
Имеется код для создания таблицы, долго думал, как же можно создать ее но более красивым способом
tblStyle = {
		position : 'absolute',
		display : 'none',
		opacity : '0',
		filter : 'alpha(opacity=0)',
		fontFamily : pr_font,
		fontSize : '11px',
		color : pr_font_color,
		border : '0px'
	}
	
    // создаем саму подсказку
	this.table = document.createElement('table');
	
	for(var z in tblStyle) {
	    this.table.style[z] = tblStyle[z];
	}
	
	for(var i = 0; i < 2; i++) {
	    this.table.insertRow(i);
		
		for(var a = 0; a < 4; a++) {
		    this.table.rows[i].insertCell(a);
		}
	}
	
	this.table.rows[0].cells[1].colSpan = 2;
	this.table.rows[0].deleteCell(2);
	this.table.cellSpacing = 0;
	this.table.cellPadding = 0;
	
	var cell = this.table.rows[0].cells[0];
	cell.style.width = '4px';
	(img = new Image()).src = pr_bg_dir + pr_kind + '/borderLeft.gif';
	cell.appendChild(img);
	
	var cell = this.table.rows[0].cells[1];
	cell.align = 'center';
	cell.style.backgroundImage = 'url(' + pr_bg_dir + pr_kind + '/centerLine.gif)';
	cell.style.backgroundPosition = 'top left';
	cell.style.backgroundRepeat = 'repeat-x';
	
	var cell = this.table.rows[0].cells[2];
	cell.style.width = '8px';
	(img = new Image()).src = pr_bg_dir + pr_kind + '/borderRight.gif';
	cell.appendChild(img);
	
	var cell = this.table.rows[1].cells[0];
	cell.style.width = '4px';
	cell.align = 'left';
	cell.style.verticalAlign = 'top';
	(img = new Image()).src = pr_bg_dir + pr_kind + '/borderLeftBottom.gif';
	cell.appendChild(img);
	
	var cell = this.table.rows[1].cells[1];
	cell.style.width = '33px';
	cell.align = 'left';
	cell.style.verticalAlign = 'top';
	(img = new Image()).src = pr_bg_dir + pr_kind + '/bottom.gif';
	cell.appendChild(img);
	
	var cell = this.table.rows[1].cells[2];
	cell.style.backgroundImage = 'url(' + pr_bg_dir + pr_kind + '/bottomLine.gif)';
	cell.style.backgroundPosition = 'top';
	cell.style.backgroundRepeat = 'repeat-x';
	
	var cell = this.table.rows[1].cells[3];
	cell.style.width = '8px';
	cell.align = 'left';
	cell.style.verticalAlign = 'top';
	(img = new Image()).src = pr_bg_dir + pr_kind + '/borderRightBottom.gif';
	cell.appendChild(img);
	
	document.body.appendChild(this.table);
Ответить с цитированием
  #2 (permalink)  
Старый 26.07.2009, 19:43
Аватар для x-yuri
Отправить личное сообщение для x-yuri Посмотреть профиль Найти все сообщения от x-yuri
 
Регистрация: 27.12.2008
Сообщений: 4,201

var f = new DocumentFragment(); // или div
    // если с DocumentFragment такое не прокатит
f.innerHTML = '<table ...>'+
                  '<tr><td>...'+
                  '<tr><td>...'+
              '</table>';

а стили я бы все-таки в css вынес
Ответить с цитированием
  #3 (permalink)  
Старый 26.07.2009, 19:50
Аватар для HelpeR
Профессор
Отправить личное сообщение для HelpeR Посмотреть профиль Найти все сообщения от HelpeR
 
Регистрация: 21.10.2008
Сообщений: 241

x-yuri, до такого способа я додумался, подумал, может еще есть что нибудь кроме innerHTML ??
Ответить с цитированием
  #4 (permalink)  
Старый 26.07.2009, 20:08
Аватар для x-yuri
Отправить личное сообщение для x-yuri Посмотреть профиль Найти все сообщения от x-yuri
 
Регистрация: 27.12.2008
Сообщений: 4,201

еще можно твой код отрефакторить. Только непонятно зачем создавать каждый элемент, если можно все одной строкой
Ответить с цитированием
  #5 (permalink)  
Старый 26.07.2009, 20:12
Аватар для HelpeR
Профессор
Отправить личное сообщение для HelpeR Посмотреть профиль Найти все сообщения от HelpeR
 
Регистрация: 21.10.2008
Сообщений: 241

Сообщение от x-yuri Посмотреть сообщение
еще можно твой код отрефакторить.
что такое отрефакторить?

Последний раз редактировалось HelpeR, 26.07.2009 в 22:39.
Ответить с цитированием
  #6 (permalink)  
Старый 27.07.2009, 09:58
Аватар для B~Vladi
Модератор Всея Форума
Отправить личное сообщение для B~Vladi Посмотреть профиль Найти все сообщения от B~Vladi
 
Регистрация: 14.05.2009
Сообщений: 4,021

Сообщение от x-yuri
var f = new DocumentFragment();
Это что за конструкция?!
И почему она может не прокатить?!

Везде прокатывает такое:
var f = document.createDocumentFragment();
Ответить с цитированием
  #7 (permalink)  
Старый 29.07.2009, 22:15
Аватар для x-yuri
Отправить личное сообщение для x-yuri Посмотреть профиль Найти все сообщения от x-yuri
 
Регистрация: 27.12.2008
Сообщений: 4,201

Сообщение от HelpeR
что такое отрефакторить?
в твоем случае насоздавать функций, за счет которых твой скрипт уменьшится, но innerHTML имхо тут самый лучший вариант. P.s. рефакторинг

Сообщение от B~Vladi
Это что за конструкция?!
ошибся
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как удалить таблицу созданную в JS? konstantinopol Общие вопросы Javascript 9 10.09.2011 10:55
вывод результатов поиска в таблицу в отдельном окне muhrab Элементы интерфейса 16 02.07.2009 17:26
Ввод данных в таблицу pwrmind Общие вопросы Javascript 2 06.03.2009 19:17
перенос данных в динамическую таблицу Елена Общие вопросы Javascript 0 28.10.2008 15:53
Выбор рандомом таблицу css AlexMak Events/DOM/Window 8 16.10.2008 14:08