JS for循环有关变量类型的问题/魔兽世界样式的tooltip

本文主要是介绍JS for循环有关变量类型的问题/魔兽世界样式的tooltip，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

<script>var num = 100;for (var i=num-5;i<num+5;i++){// console.log(typeof(i));console.log("i");}
</script>

这段代码控制台会输出10次i;

<script>var num = "100";for (var i=num-5;i<num+5;i++){// console.log(typeof(i));console.log("i");}
</script>

因为"100" - 5是95，而"100" + 5是1005

这段代码会输出几百次i;是为什么？？区别仅仅是赋值给变量num的是字符串或数字

text-shadow的立体效果，opacity透明；

Jade,Ejs,Handlebars三种模板的对比；

Modernizr,Html5,Css3特性检测库

参考的代码

CSS部分：图标的出现，样式等

.wow-item {position: absolute;color: white;background-color: rgba(10, 0, 5, 0.8);font-family: "friz", serif;font-size: 12px;font-weight: normal;padding: 0.5em 0.6em;text-shadow: 0 1px 0 black;box-shadow: -1px -1px 1px rgba(10, 0, 5, 0.5), -1px 1px 1px rgba(10, 0, 5, 0.5), 1px 1px 1px rgba(10, 0, 5, 0.5), 1px -1px 1px rgba(10, 0, 5, 0.5);max-width: 24em;-webkit-transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s;-o-transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s;transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s;
}.wow-item.hidden {visibility: hidden;opacity: 0;-webkit-transform: scale(0.95);-ms-transform: scale(0.95);-o-transform: scale(0.95);transform: scale(0.95);-webkit-transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s, visibility 0.01s linear 0.15s;-o-transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s, visibility 0.01s linear 0.15s;transition: opacity 0.05s ease-out 0.05s, transform 0.1s ease-out 0.05s, visibility 0.01s linear 0.15s;
}.wow-icon, .wow-item {border-style: solid;border-width: 5px;border-image: url(../img/wow-tooltip-border-2.png) 5 repeat;border-radius: 4px;
}

$wowIcons.on('mouseover.wow', function (e) {var $this = $(this);var $html;if (!lastHovered || !lastHovered.is($this)) {var id = $this.data('item-id');$html = $(template(items[id]));$body.find('.wow-item').remove();$body.append($html);$html.css({left: e.clientX + 20,top: e.clientY - 10});lastHovered = $this;} else {$html = $('.wow-item');}setTimeout(function () {$html.removeClass('hidden');}, 10);$this.on('mousemove.wow', function (e) {$html.css({left: e.clientX + 20,top: e.clientY - 30});});
});
$wowIcons.on('mouseout.wow', function (e) {$body.find('.wow-item').addClass('hidden');$(this).off('mousemove.wow');
});
$body.on('mouseover.wow', '.wow-item', function (e) {
});
$body.on('mouseout.wow', '.wow-item', function (e) {$(this).addClass('hidden');
});