تعليق: أطلقت HTML5 رؤية صفحة API "خاصة" للغاية. السبب في أنه مميز هو أن API تركز على ميزة يثبت قلة من الناس الانتباه إليها - سواء تم تنشيط علامة المستعرض (علامة التبويب)
يجب شرح هنا أن هذا "التنشيط" يشير إلى ما إذا كان المستخدم يتم تصفحه من قبل المستخدم ، أو ما إذا كانت العلامة الحالية.
إذن ، ما هو الغرض من واجهة برمجة التطبيقات هذه؟ عادةً ما تستمر العديد من الصفحات التقليدية في العمل عندما لا يقوم المستخدم بتنشيطه. على سبيل المثال ، عندما يقوم المستخدم بتصفح بوابة الأخبار ، وستستمر صفحة لعبة الدوري الاميركي للمحترفين الذي افتتحه قبل التحديث والحصول على أحدث النتائج ، سيستمر موقع الويب في شغل نطاق النطاق الترددي والموارد. لذلك ، إذا كانت هناك حاجة إلى الكثير من العمل غير الضروري ، فسيتم سبب الكثير من نفايات الموارد. لذلك ، هذا مفيد للغاية:
1. سيقوم برنامج الويب تلقائيًا بتحديث معلومات الصفحة كل مرة كل فترة لضمان حصول المستخدم على معلومات في الوقت المناسب. ومع ذلك ، عندما يقوم المستخدم بتصفح الصفحات الأخرى ، يمكن التحكم فيه لإيقاف التحديثات.
2. عندما يلعب موقع الفيديو على الإنترنت على الإنترنت ، سيتم تحميل الفيديو باستمرار حتى يتم تحميل الفيديو. ومع ذلك ، عندما يقوم المستخدم بتصفح الصفحات الأخرى ، يمكنه إيقاف تحميل موارد الفيديو لتوفير النطاق الترددي.
3. هناك شريحة كبيرة على الصفحة الرئيسية للموقع الذي يلعب تلقائيًا. عندما يتصفح المستخدم الصفحات الأخرى ، يمكن إيقاف التشغيل.
لذلك ، من خلال رؤية الصفحة ، يمكننا تحقيق واحد أو أكثر من الفوائد التالية على الأقل:
1. حفظ موارد الخادم. غالبا ما يتم تجاهل الاقتراع أياكس. أغلق هذا الطلب يمكن أن يوفر الموارد.
2. حفظ استهلاك الذاكرة.
3. حفظ الاستهلاك النطاق الترددي.
لذلك ، يعد استخدام رؤية الصفحة مفيدًا لكل من المستخدمين والخوادم.
بعد ذلك ، دعونا نقدم API هذا رسميًا. تضيف رؤية الصفحة اثنين من الخصائص المخفية و stibility state على كائن مستند المتصفح. إذا تم تنشيط العلامة الحالية ، فإن قيمة المستند. لدى ConsibilityState 4 قيم ممكنة:
1.hidden: عندما يتم تقليل المتصفح ، وتبديل العلامات ، وقفل شاشة الكمبيوتر ، يتم إخفاء قيمة محطة الرؤية
2. غير مرغوب فيه: عندما يتم عرض مستند سياق المستوى الأعلى للمستعرض في شاشة واحدة على الأقل ، فإنه يعود مرئيًا ؛ عندما لا يتم تقليل نافذة المتصفح ، ولكن يتم حظر المتصفح بواسطة تطبيقات أخرى ، فهو مرئي أيضًا
3.Prerender: إرجاع Prerender عندما يتم تحميل المستند خارج الشاشة أو غير مرئي. هذه خاصية غير ضرورية ويمكن للمتصفح دعمها بشكل انتقائي.
4. محمّل: إرجاع التفريغ عندما يكون المستند على وشك أن يتم تركه (تفريغ) ، ويمكن للمتصفح أيضًا دعم هذه الخاصية بشكل انتقائي.
بالإضافة إلى ذلك ، تتم إضافة حدث CorrabilityChange على المستند ، والذي يتم تشغيله عندما تتغير رؤية المستند.
حسنًا ، بعد تقديم الخصائص ، ضع مثالًا على الاستخدام (انسخ الرمز وحفظه إلى ملف HTML ، قم بتبديل العلامات لاختبار التأثير بعد الفتح).
<! doctype html>
<html lang = "zh-cn">
<head>
<meta charset = "utf-8" />
<title> اختبار HTML5 PAGE API </title>
</head>
<body> </p> <p> <viv> </viv>
<script>
وظيفة prowserkernel () {
نتيجة var
['webkit' ، 'moz' ، 'o' ، 'ms'].
النتيجة = بادئة ؛
}
}) ؛
نتيجة العودة
}
وظيفة init () {
بادئة = browserkernel () ؛
var showtip = document.getElementById ('showtip') ؛
document.adDeventListener (بادئة + 'CompanibilityChange' ، وظيفة onvisibilitychange (e) {
نصيحة var = null ؛
if (document [prefix + 'prosibilityState'] == 'Hidden') tip = '<p> اترك الصفحة </p>' ؛
وإلا
showtip.innerhtml = showtip.innerhtml + tip ؛
}) ؛
}
window.onload = init () ؛
</script>
</body>
</html>
الغرض من هذا المثال هو مراقبة ما إذا كانت رؤية العلامة تتغير وإنشاء مطالبة عندما تتغير رؤية العلامة.
تجدر الإشارة إلى أنه في الوقت الحالي ، تدعم المتصفحات رؤية صفحة من خلال السمات الخاصة. لذلك ، عند اكتشاف أو استخدام الخصائص التي توفرها رؤية الصفحة ، تحتاج إلى إضافة بادئة خاصة للمتصفح. على سبيل المثال ، عند اكتشاف خاصية ConsibilityState أعلاه في Chrome ، تحتاج إلى اكتشاف document.webKitVisability State بدلاً من Document.VibilityState. لذلك ، سيقوم العرض التجريبي أولاً باكتشاف نوع المتصفح ، ثم يستخدم واجهة برمجة تطبيقات رؤية الصفحة.