Archive for the ‘JavaScript’ Category

Разные типы - разный результат

Monday, March 24th, 2008

Что надо помнить создании разных типов данных

var a = 7; // число
var b = "7"; // строка

int a = 7; // число
String b = "7"; // строка

а так же при сложении

document.writeln(7 + 7 + 7);   // = 21
document.writeln(7 + 7 + "7"); // = 147
document.writeln("7" + 7 + 7); // = 777

и так же при сравнении

1 == true; // = true
1 === true; // = false  

7 == "7"; // = true
7 === "7"; // = false;

Вызов JS через AppleScript

Wednesday, March 5th, 2008

Ага, не удивляйтесь, но AppleScript позваляет управлять JavaScript на прямую через браузер. Например вызывать alert

tell application "Safari"
	do JavaScript "alert('hi')" in document 1
end tell

Или вызвать функцию на странице

tell application "Safari"
	do JavaScript "doSome()" in document 1
end tell

Перевод MySQL DATETIME в JS Date()

Monday, March 3rd, 2008

Вот такая функция

function mysqlTimeStampToDate(timestamp) {

var regex=/^([0-9]{2,4})-([0-1][0-9])-([0-3][0-9])
   (?:([0-2][0-9]):([0-5][0-9]):([0-5][0-9]))?$/;
var parts=timestamp.replace(regex,"$1 $2 $3 $4 $5 $6").split(' ');
return new Date(parts[0],parts[1],parts[2],parts[3],parts[4],parts[5]);

}

надо сказать здесь поверяется соответствие даты формату, например [0-9]{2,4} говорит о том что год может быть как 2-х так 4-х циферный, если быть уверенным, что входящая дата выглядит по всем правилам то проверку можно сделать проще

var regex=/^([0-9]{4,})-(\d\d)-(\d\d) (?:(\d\d):(\d\d):(\d\d))?$/;

Проверка на IE7

Friday, February 29th, 2008

Есть множество способов проверки и вот один из них это использовать условные комментарии

<!––[if IE 7]>
<script type="text/javascript"> ie7 = true; </script>
<![endif]––>

Условные комментарии работают только в Explorer под Windows, и они отлично подходят для написания специальных инструкций адресованных Explorer под Windows. Эти инструкции поддерживаются начиная с версии Internet Explorer 5 и выше и даже существует возможность давать различные инструкции разным версиям Explorer 5.0, 5.5, 6.0.

подробнее про Условные комментарии

insertAfter на Prototype

Wednesday, February 27th, 2008

Небольшой prototype для вставки нового узла после указанного

Node.prototype.insertAfter = function(newNode, refNode) {
    if(refNode.nextSibling) {
        return this.insertBefore(newNode, refNode.nextSibling);
    } else {
        return this.appendChild(newNode);
    }
}

Смысл в том что в самом JavaScript отсутствует insertAfter. Для того что бы добавить узел после нужного использовался первый кусок кода node.insertBefore(newNode, refNode.nextSibling), в то время как здесь встроена еще проверка что если nextSibling отсутствует то используй appendChild иначе попросту вставь в конец.
Как это работает

<script type="text/javascript">
function makeins(){
	doc = document.getElementById("doc");
	r = document.getElementById("r2");
	p = document.createElement("LI");
	pt= document.createTextNode("3");
	p.appendChild(pt);
	doc.insertAfter(p, r);
}
</script>
...
<ul id="doc">
	<li id="r1">1</li>
	<li id="r2">2</li>
</ul>

Убрать/установить задний фон

Thursday, February 21st, 2008
var node = document.getElementById(ID);
node.style.backgroundImage="url(bgimg.jpg)" | "";

понимают: IE 4, FF 1, Opera 9

Три варианта удаления childNodes

Tuesday, February 5th, 2008

Вариант 1

function removebyindex(){
 var node = document.getElementById('papa');
 var childs = node.childNodes;
 for (i=0; i<childs.length; i++){
  if(childs[i].nodeType==1){
   node.removeChild(childs[i]);
  }
 }
}

Вариант самый логичный, получить елемент у которого надо убрать дочерние узлы, получить масив дочерних узлов а потом их удалить.

Вариант 2

function removebyfirst(){
	var node = document.getElementById('papa');
	while(node.firstChild){
		node.removeChild(node.firstChild);
	}
}

Еще короче и еще быстрее, удаляй первого пока на его место будет некому встать. Лучше чем первый, так как запись короче, но тем не менее по скорости они одинаковы, хотя память чуть меньше загружена

Вариант 3
Сразу надо оговориться что подходит он не для любого случая.

function removebypreplace(){
	var papa = document.getElementById('papa');
	var new_papa = document.createElement(papa.nodeName);
	new_papa.id = papa.id;
	papa.parentNode.replaceChild(new_papa, papa);
}

Создай элемент похожий на наш и замени. В чем приемущество, быстрота и еще меньшее использование памяти.

Вот небольшая сводная таблица

Функция Память Время
removebyindex 93.03% 1.482ms
removebyfirst 92.91% 1.403ms
removebypreplace 89.09% 0.874ms

Переносы строки и Json

Monday, January 28th, 2008

Столкнулся с такой проблемой, есть текст с переносом строки внутри

Привет
Как дела?

Когда пытаюсь передать её через Ajax под видом JSON получается следующее

{custom:"Привет
Как дела?"}

Работающий перенос строки останавливает работу скрипта. Надо было убрать перенос для js, но что бы он одновременно работал в форме куда этот текст и вставлялся

$value = preg_replace('#[\n\r]+#', "\\n", $value);

Теперь все стало работать так как текст выглядит так

{custom:"Привет\nКак дела?"}

Быстрое создание объекта

Wednesday, January 16th, 2008

быстро создаем объект в js

var obj = {os: "FreeBSD", version: "6.2-STABLE"}

и получаем его значения

document.write(obj.os); // FreeBSD

document.writeln(obj['version']); //6.2-STABLE

for (key in obj){
  document.writeln(obj[key]);
}

Include javascript by XMLHttpRequest

Wednesday, December 26th, 2007

Не хотите подгружать js просто из файла, тогда грузите через Ajax. На самом деле речь идёт не о том, что-бы закгружать именно коды, а загружать данные, масивы актуальные для текушео запроса

function include(jsFileLocation){
	if(window.XMLHttpRequest){
		var req = new XMLHttpRequest();
	}else{
		var req = new ActiveXObject("Microsoft.XMLHTTP");
	}
	req.open("GET", jsFileLocation,false);
	req.onreadystatechange = function(){
		if (req.readyState == 4){
			window.eval(req.responseText);
		}
	}
	req.send(null);
}