我有一个脚本，当元素进入视口时加载jQuery，就像Javascript发现的那样（没有库），它如下所示：
viewport.js:
var height = 0;
if( typeof( window.innerWidth ) == \'number\' ) {
//Non-IE
height = window.innerHeight;
} else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in \'standards compliant mode\'
height = document.documentElement.clientHeight;
} else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
height = document.body.clientHeight;
}
function gingah_comments_onLoad() {
var element = document.getElementById("comments");
var current = height+document.body.scrollTop;
var target = element.offsetTop;
console.log(current);
console.log(target);
if (current >= target) {
if (typeof jQuery == \'undefined\') {
$.defer("http://localhost/wp/wp-includes/js/jquery/jquery.js", {
}).done(console.log(\'loaded jQuery\'));
window.onscroll = null;
}
}
}
window.onscroll = gingah_comments_onLoad;
And the html used:
<head>
<script src="DeferJS.min.js" type="text/javascript"></script>
<script src="viewport.js" type="text/javascript"></script>
</head>
<body>
<div style="height: 1000px; border: 1px solid #ff0000;">Top</div>
<div class="comment_box" style="height: 1000px; border: 1px solid #ff0000;">
<div id="comments">Comment1</div>
</div>
</body>
德尔杰斯。min.js是指以下内容的缩小版本：
https://github.com/BorisMoore/DeferJS/raw/master/DeferJS.js然而，当我尝试在Wordpress（3.1）中实现这一点时，我为两个视口都使用了wp\\u enqueue\\u脚本。js和DeferJS。在min.js中，scrollTop似乎根本不起作用。当上面的HTML和JS组合在一起时，它会将值记录到控制台，以便在注释进入视口时非常清楚。
但是当在Wordpress中复制这个过程时，当前变量在向下滚动时不会向上计数，而是保持静态。根据Firebug的说法，还有viewport。js，延迟js。最小js和l10n。js（Wordpress 3.1本地化）是唯一加载的脚本。而且Quirksmode 列出了几乎在所有浏览器中都可用的scrollTop方法。
文件中出现此故障的原因可能是什么。身体scrollTop？
最合适的回答,由SO网友:OleVik 整理而成
Wordpress中的某些东西似乎会导致虚拟恢复到需要跨浏览器兼容性的标准，使得相同的代码在Wordpress内外都无法工作。但是，使用一些代码来处理浏览器差异（并且仍然避免使用库），下面是viewport.js 现在看起来像：
function height() {
if( typeof( window.innerWidth ) == \'number\' ) {
//Non-IE
return window.innerHeight;
} else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in \'standards compliant mode\'
return document.documentElement.clientHeight;
} else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
return document.body.clientHeight;
}
}
function distance() {
if(typeof pageYOffset!= \'undefined\'){
//most browsers
return pageYOffset;
} else {
var B= document.body; //IE \'quirks\'
var D= document.documentElement; //IE with doctype
D= (D.clientHeight)? D: B;
return D.scrollTop;
}
}
function gingah_comments_onLoad() {
var element = document.getElementById("comments");
var current = height()+distance();
var target = element.offsetTop;
console.log(current);
console.log(target);
if (current >= target) {
if (typeof jQuery == \'undefined\') {
$.defer("http://localhost/wp/wp-includes/js/jquery/jquery.js", {
}).done(console.log(\'loaded jQuery\'));
window.onscroll = null;
}
}
}
window.onscroll = gingah_comments_onLoad;
然后在查看comments元素时，从标准Wordpress路径加载jQuery。
