Вычисление посещённых ссылок пользователя с помощью Javascript и DOM Level 2

Для этого нам нужен метод объекта window — getComputedStyle. В ИЕ как всегда всё непросто — у него есть свойство currentStyle элемента.

Ниже — пример (ну его лучше бы немного усложнить — не нужен нам лишний div в дереве).

Пример. Вычисление посещённых ссылок

<style>
a {color: rgb(255,0,0);}
a:visited {color: rgb(0,255,0);}
</style>

<div style="display:none;">
<a href="http://12331231223.ru">1>/a>
<a href="http://ya.ru">2>/a>
</div>

<script>
//в ИЕ такого метода нету - декорируем
//http://snipplr.com/view/13523/getcomputedstyle-for-ie/
if (!window.getComputedStyle) 
{
    window.getComputedStyle = function(el, pseudo) 
	{
        this.el = el;
        this.getPropertyValue = function(prop) 
		{
            var re = /(\-([a-z]){1})/g;
            if (prop == 'float') prop = 'styleFloat';
            if (re.test(prop)) 
			{
                prop = prop.replace(re, function (){return arguments[2].toUpperCase();});
            }
            return el.currentStyle[prop] ? el.currentStyle[prop] : null;
        }
        return this;
    }
}



var links = document.getElementsByTagName('a');
var msg = '';
for (var i = 0; i < links.length; ++i)
{
	var link = links[i];
	var computedStyle = getComputedStyle(link, null);
	var visited = false;
	var color = computedStyle.getPropertyValue('color');
	if (color == 'rgb(0, 255, 0)'/*ff*/ || color == 'rgb(0,255,0)'/*ie*/ || color == '#00ff00'/*opera*/)
		visited = true;
	msg += link.href + ' ' + ((visited) ? 'visited' : 'not visited') + '\n';
}
alert (msg);
</script>

<style>

a {color: rgb(255,0,0);}

a:visited {color: rgb(0,255,0);}

</style>

</div>

//в ИЕ такого метода нету - декорируем

//http://snipplr.com/view/13523/getcomputedstyle-for-ie/

if (!window.getComputedStyle)

{

window.getComputedStyle = function(el, pseudo)

{

this.el = el;

this.getPropertyValue = function(prop)

{

var re = /(\-([a-z]){1})/g;

if (prop == 'float') prop = 'styleFloat';

if (re.test(prop))

{

prop = prop.replace(re, function (){return arguments[2].toUpperCase();});

}

return el.currentStyle[prop] ? el.currentStyle[prop] : null;

}

return this;

}

var links = document.getElementsByTagName('a');

var msg = '';

for (var i = 0; i < links.length; ++i)

{

var link = links[i];

var computedStyle = getComputedStyle(link, null);

var visited = false;

var color = computedStyle.getPropertyValue('color');

if (color == 'rgb(0, 255, 0)'/*ff*/ || color == 'rgb(0,255,0)'/*ie*/ || color == '#00ff00'/*opera*/)

visited = true;

msg += link.href + ' ' + ((visited) ? 'visited' : 'not visited') + '\n';

}

alert (msg);

</script>

Есть у браузеров как всегда забавные особенности — при получении вычисленного цвета

Firefox всегда возвращает строку вида ‘rgb(0, 255, 0)‘
Internet Explorer — ровно то, что записано в стиле: написали ‘rgb(0,255,0)‘ — получили их «на выходе», написали ‘#0f0‘ — ровно эту же строку и получили (хотя если написать в стилях ‘rgb(0, 255, 0)‘, то получим ‘rgb(0,255,0)‘, т.е. пробелы видимо режет)
Opera возвращает строку вида ‘#00ff00‘

Вычисление посещённых ссылок пользователя с помощью Javascript и DOM Level 2

Similar Posts

One Response so far.

LEAVE A COMMENT Отменить ответ