在淘宝的 wap 页面里看到他们用的是 rem 单位,在 header 里面有一个外链的 js:
https://h5.m.taobao.com/app/category/www/js/tbm.js
全部代码如下:
! function(a) {
function b() {
var b = f.getBoundingClientRect().width;
a.rem = b / 16,
h.innerHTML = "html{font-size:" + a.rem + "px}body{font-size:" + parseInt(12 * (b / 320)) + "px}"
}
var c,
d,
e,
f = document.documentElement,
g = document.querySelector('meta[name="viewport"]'),
h = document.createElement("style");
if (g) {
console.warn("将根据已有的meta标签来设置缩放比例");
var i = g.getAttribute("content").match(/initial\-scale=(["']?)([\d\.]+)\1?/);
i && (d = parseFloat(i[2]), c = 1 / d)
}
if (!c && !d) {
var j = (a.navigator.appVersion.match(/android/gi),
a.navigator.appVersion.match(/iphone/gi)),
c = a.devicePixelRatio;
c = j && c >= 2 ? 2 : 1, d = 1 / c
}
if (f.setAttribute("data-dpr", c), !g)
if (g = document.createElement("meta"), g.setAttribute("name", "viewport"), g.setAttribute("content", "initial-scale=" + d + ", maximum-scale=" + d + ", minimum-scale=" + d + ", user-scalable=no"), f.firstElementChild) f.firstElementChild.appendChild(g), f.firstElementChild.appendChild(h);
else {
var k = document.createElement("div");
k.appendChild(g), document.write(k.innerHTML)
}
a.dpr = c, a.addEventListener("resize", function() { clearTimeout(e), e = setTimeout(b, 300) }, !1), a.addEventListener("pageshow", function(a) { a.persisted && (clearTimeout(e), e = setTimeout(b, 300)) }, !1), b()
}(window);
这里面有一段代码:
if (g = document.createElement("meta"),
g.setAttribute("name", "viewport"),
g.setAttribute("content", "initial-scale=" + d + ", maximum-scale=" + d + ", minimum-scale=" + d + ", user-scalable=no"),
f.firstElementChild)
f.firstElementChild.appendChild(g), f.firstElementChild.appendChild(h);
里面的 f.firstElementChild ,即指 document.documentelement.firstElementChild ,请问这个值在什么浏览器、什么情况下会是 false ?请高手赐教,谢谢。
在当前面打开发者工具,打开控制台(我假设你使用的是chrome浏览器)
输入
document.body.firstChild
document.body.firstElementChild
以上结果都不会为false;
再测试
var d = document.getElementById("sortby-created");
d.firstChild
d.firstElementChild
以上结果也没有false的情况,只有null
的情况。
--update--
看了评论我又明白了一点了。
var firstChild = null;
if(!firstChild) {
console.log('you got me');
}
null
值可以当做false
来看待。