The practice of JS operating HTML "1"--to achieve web site fake crashes attract netizens attention

When I visited the website some days ago, I found some interesting details: when the page loses focus, the title shows the webpage crashes, which will cause the browser to point back to the page.

Examples from Anotherhome (https://www.anotherhome.net/) and Morning Asahi Blog (https://www.chenxublog.com/)

||||||||

(pictured as Anotherhome)

Bo Master pressed the F12 ... 's Finger licking (￣▽￣)? found this code:

1 //Title Change2         varOrigintitile =Document.title;3         varTitletime;4Document.addeventlistener (' Visibilitychange ',function () {5             if(Document.hidden) {6$ (' [rel= ' shortcut Icon "] '). attr (' href ',"//www.anotherhome.net/wp-content/themes/amativeness/fail.ico ");7Document.title = ' (-) Oh, it's crashing! ‘;8 cleartimeout (titletime);9}Else {Ten$ (' [rel= ' shortcut Icon "] '). attr (' href ',"//www.anotherhome.net/wp-content/themes/amativeness/favicon.ico "); OneDocument.title = ' (/≧▽≦/)! It's good! ' +Origintitile; ATitletime = SetTimeout (function () { -Document.title =Origintitile; -}, 2000); the             } -});
(from Anotherhome)

Such a code:

1 varorigintitile=Document.title;2 varSt;3Document.addeventlistener (' Visibilitychange ',function(){if(Document.hidden) {document.title= "╭ (°a° ') ╮ page crashes";4 Cleartimeout (ST);5 //console.log (' hide ');6}Else{document.title= "(? >ω<*?) Aye is good ~" +Origintitile;7 //Console.log (' Show ');8St=settimeout (function() {document.title=origintitile;},4000);9 //console.log (' endchange= ');Ten } One});
(from Chen Xu's blog)

So, just think about it and add one of these features to your website: I'm going to make a change to the template with the morning Asahi big code.

1. Create a new HTML document

2. Write <script> label

In this step, the blogger experiment found a problem: the title tag must be before the fake crash code.

otherwise:| | | | | | | |

will not be implemented

Document.title= "tut-tut cheat you" +origintitile;

The expected effect, and the title is changed after timeout.

Careful children's shoes will notice that the source of Anotherhome more

$ (' [rel= ' shortcut icon '] '). attr (' href ', '//www.anotherhome.net/wp-content/themes/amativeness/fail.ico ');

This line, which changes the favicon of the page (the small icon to the left of the page title)

Summary: JS can use the Document.title record set to change the page title,

Document.addeventlistener (' visibilitychange ',function() {if(Document.hidden)

will be able to detect whether the Web page has focus.

The practice of JS operating HTML "1"--to achieve web site fake crashes attract netizens attention