วิธีที่ง่ายที่สุดในการรับไอคอนเว็บไซต์คือการรับผ่านเว็บไซต์/favicon.ico อย่างไรก็ตามเนื่องจากเว็บไซต์หลายแห่งตั้งค่า Favicon บนหน้าวิธีนี้ไม่สามารถใช้งานได้ในหลาย ๆ สถานการณ์
วิธีที่ดีกว่าคือการบรรลุเป้าหมายนี้ผ่านบริการที่จัดทำโดย Google:
http://www.google.com/s2/favicons?domain=http://www.baidu.com
รหัส:
การคัดลอกรหัสมีดังนี้:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<style type = "text/css">
#ป้อนข้อมูล {
ความสูง: 300px;
Padding: 10px 5px;
ความสูงของสาย: 20px;
ความกว้าง: 1000px;
-
#ส่ง {
ความสูง: 30px;
TEXT-ALIGN: CENTER;
สี: #ffffff;
ระดับความสูง: 30px;
ความกว้าง: 80px;
พื้นหลังสี: สีน้ำเงิน;
ระยะขอบด้านบน: 20px;
-
#ผลลัพธ์ {
ระยะขอบด้านบน: 20px;
-
#Result Li {
ความสูง: 40px;
สายไฟ: 40px;
ลอย: ซ้าย;
มาร์จิ้น: 10px 14px;
-
</style>
</head>
<body>
<textarea id = "input" placeholder = "ป้อน URL หลายตัวด้วยช่วงเวลาของอวกาศ"> </textarea>
<div id = "ส่ง"> รับไอคอน </div>
<ul id = "ผลลัพธ์">
</ul>
<script type = "text/javascript">
var input = document.getElementById ("อินพุต");
var submit = document.getElementById ("ส่ง");
var result = document.getElementById ("ผลลัพธ์");
var val;
ฟังก์ชั่นตัดแต่ง (str) {
var whitespace = '/n/r/t/f/x0b/xa0/u2000/u2001/u2002/u2003/u2004/u2005/u2006/u2007/u2008/u2009/u200a/u200b/u2028/u2028
สำหรับ (var i = 0, len = str.length; i <len; i ++) {
if (whitespace.indexof (str.charat (i)) === -1) {
str = str.substring (i);
หยุดพัก;
-
-
สำหรับ (i = str.length-1; i> = 0; i--) {
if (whitespace.indexof (str.charat (i)) === -1) {
str = str.substring (0, i + 1);
หยุดพัก;
-
-
ส่งคืน whitespace.indexof (str.charat (0)) === -1? str: '';
-
ฟังก์ชั่น getFavicOnurl (url) {
var prohost;
prohost = url.match (/([^: //?#]+: /////)? ([^//@:]+)/i);
prohost = prohost? prohost: [จริง, "http: //", document.location.hostname];
// กรอก URL
ถ้า (! prohost [1]) {
prohost [1] = "http: //";
-
// คลาน ICO
return "http://www.google.com/s2/favicons?domain=" + prohost [1] + prohost [2];
-
submit.onclick = function () {
val = input.value;
if (! val) การแจ้งเตือน ("อินพุตว่างเปล่า!");
val = val.split ("");
val.foreach (ฟังก์ชั่น (รายการ) {
item = trim (รายการ);
if (! item) return;
result.innerhtml + = "<li>" + item + "<img src = '" + getFavicOnurl (รายการ) + "'> </li>";
-
-
</script>
</body>
</html>
ดาวน์โหลดซอร์สโค้ด