Home > Developer > JavaScript
The simplest way to get website icons is to get them through website/favicon. ico. However, many websites use favicon in pages, so this method is unavailable in many cases.
A better solution is to use the services provided by google:
Http://www.google.com/s2/favicons? Domain = http://www.baidu.com
Code:
Copy codeThe Code is as follows:
<! Doctype html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Style type = "text/css">
# Input {
Height: 300px;
Padding: 10px 5px;
Line-height: 20px;
Width: 1000px;
}
# Submit {
Height: 30px;
Text-align: center;
Color: # ffffff;
Line-height: 30px;
Width: 80px;
Background-color: blue;
Margin-top: 20px;
}
# Result {
Margin-top: 20px;
}
# Result li {
Height: 40px;
Line-height: 40px;
Float: left;
Margin: 10px 14px;
}
</Style>
</Head>
<Body>
<Textarea id = "input" placeholder = "enter multiple URLs separated by spaces"> </textarea>
<Div id = "submit"> Get icon </div>
<Ul id = "result">
</Ul>
<Script type = "text/javascript">
Var input = document. getElementById ("input ");
Var submit = document. getElementById ("submit ");
Var result = document. getElementById ("result ");
Var val;
Function trim (str ){
Var whitespace = '\ n \ r \ t \ f \ x0b \ xa0 \ u2000 \ u2001 \ u2002 \ u2003 \ u2004 \ u2005 \ u2006 \ u2007 \ u2008 \ u2009 \ u200a \ u200b \ u2028 \ u2029 \ u3000 ';
For (var I = 0, len = str. length; I <len; I ++ ){
If (whitespace. indexOf (str. charAt (I) ===-1 ){
Str = str. substring (I );
Break;
}
}
For (I = str. length-1; I> = 0; I --){
If (whitespace. indexOf (str. charAt (I) ===-1 ){
Str = str. substring (0, I + 1 );
Break;
}
}
Return whitespace. indexOf (str. charAt (0) ===-1? Str :'';
}
Function getFavIconUrl (url ){
Var prohost;
Prohost = url. match (/([^ :\/? #] + :\/\/)? ([^ \/@:] +)/I );
Prohost = prohost? Prohost: [true, "http: //", document. location. hostname];
// Complete the url
If (! Prohost [1]) {
Prohost [1] = "http ://";
}
// Capture ico
Return "http://www.google.com/s2/favicons? Domain = "+ prohost [1] + prohost [2];
}
Submit. onclick = function (){
Val = input. value;
If (! Val) alert ("the input is empty! ");
Val = val. split ("");
Val. forEach (function (item ){
Item = trim (item );
If (! Item) return;
Result. innerHTML + = "<li>" + item + " </li> ";
});
};
</Script>
</Body>
</Html>
Source code download
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
