CODEWITHSUNDEEP
jquery
Tyler Carter
Tyler Carter

Reputation: 61567

Use jQuery to Select Visited Links

I'm trying to select all visited links via jQuery. Here is the HTML

<div class="question-summary">
    <a class="question-hyperlink">Stuff</a>
</div>

If question-hyperlink has been visited, I was to select question-summary. Any ideas?

Upvotes: 11

Views: 20831

Answers (3)

panepeter
panepeter

Reputation: 4242

The given approach has been disabled for security reasons.

As it is possible to retrieve a visitor's history by checking for visited links, certain measures have been taken by browser vendors to prevent this.

Source: Mozilla Foundation Blog.

Checked in Chrome and FF - both don't support $("a:visited") any longer.

Upvotes: 41

pendave
pendave

Reputation: 1

enter code here`It's not supported by javascript as I also try to find methods to collect a:visited links data to hide the node visited.

some reference: Privacy and the :visited selector - CSS | MDN

If all you care about is styling, you should be able to achieve it through CSS, but through what is displayed on screen should be the only way to observe it being visited.

I do this way in a userscript for Greasemonkey to let those sites without a:visited style display those already visited links.

// ==UserScript==
// @description    ADD a:visited for CSS
// @include        *annalscts.com*
// @include        *thejns.org*
// @include        *turkishneurosurgery.org.tr*
// @include        *nature.com*
// @include        *academic.oup.com*
// @include        *sagepub.com*
// @grant          GM_addStyle
// ==/UserScript==
GM_addStyle('a:visited {color:#EE5665 !important}');

For collect the data to local I use the Greasemonkey API 

GM_setValue 
GM_getValue

I just watched tutorials on Youtube for the API and try to write into the userscript

Greasemonkey API: Values just search for this title on Youtube.

Written Tutorial: http://nulleffort.com/greasemonkey-api-values/

Greasemonkey Docs: https://wiki.greasespot.net/Greasemonkey_Manual:API

some parts of my userscript

//Firstly, var the ordinary variable preVisitedLinks and assigning to memory variable visitedLinks (At first the value should be undefined)
var preVisitedLinks = GM_getValue("visitedLinks");
unsafeWindow.aclick = function(tlink){
    window.open(tlink, '_blank', 'toolbar=yes,scrollbars=yes,resizable=yes,top=10,left=10,width=10,height=10'); // click a button added and get the link visited in my script 
    //If the ordinary variable preVisitedLinks is undefined (First time running the script)
    if(preVisitedLinks.includes('undefined')){
        GM_setValue('preVisitedLinks', '|' + tlink.replace('http://paper.pubmed.cn/',''));
    }
    //If the ordinary variable preVisitedLinks is not undefined, continue to add each new string collect
    else{
        GM_setValue('preVisitedLinks', preVisitedLinks + '|' + tlink.replace('http://paper.pubmed.cn/',''));
    }
    //The ordinary variable preVisitedLinks assigning to memory variable visitedLinks value. The magic is the variable name the same.
    preVisitedLinks = GM_getValue("preVisitedLinks");
    if(preVisitedLinks.length > 27500){
        preVisitedLinks = preVisitedLinks.substr(preVisitedLinks.length - 27500);
    }
    //The memory variable visitedLinks value assigning to the ordinary variable preVisitedLinks value
    GM_setValue('visitedLinks',preVisitedLinks);
    console.info(preVisitedLinks);
};

And in some place I use the string to detect the visited links code

if(preVisitedLinks.includes(trs[i].querySelectorAll('li')[0].querySelector('a').href.replace('http://xxx.xxxx.com/',''))){
        trs[i].remove();
    }

Upvotes: 0

Maciej
Maciej

Reputation: 126

I found workaround based on LocalStorage on Nevyan's Blog: Mark visited links using JavaScript and localStorage

He proposed clean JavaScript code to store links clicked by page user in LocalStorage and add class "visited" to parent of an <a> element: 

function check_visited_links() {
    var visited_links = JSON.parse(localStorage.getItem('visited_links')) || [];
    var links = document.getElementsByTagName('a');
    for (var i = 0; i < links.length; i++) {
        var that = links[i];
        that.onclick = function() {
            var clicked_url = this.href;
            if (visited_links.indexOf(clicked_url) == -1) {
                visited_links.push(clicked_url);
                localStorage.setItem('visited_links', JSON.stringify(visited_links));
            }
        }
        if (visited_links.indexOf(that.href) !== -1) {
            that.parentNode.className += ' visited';
        }
    }
}

I don't know if it's safer than :visited approach though.

Upvotes: 3

Related Questions