css注释代码;css注释是这样的格式: /* css代码 */,多数情况下也是用于说明
js的注释;js单行注释是这样的格式: // js代码; 可以用于说明当前代码的用途啊、作用啊等等
js还能注释多行代码,格式跟css注释一样:/* js代码 */;
很抱歉,图中的try catch我研究了一下,是有意义的,我已更改文中内容
如果看不清图片,就右键保存查看
话说你是从哪找的,这代码可以称得上是工业级的了ヽ(ー_ー)ノ
如果图片看不清,这是源代码:
/*函数后的(window, document)表示要执行这个函数。所以要求(window, document)前面必须是一个表达式,而 !正是这个作用。也就意味着这是自调用函数*/
! function (e, t, a) {//这的参数a可能已被弃用
function n() {
c(".love{width: 20pxheight: 20pxposition: fixedbackground: #f00transform: rotate(45deg)-webkit-transform: rotate(45deg)-moz-transform: rotate(45deg)}.love:after,.love:before{content: ''width: inheritheight: inheritbackground: inheritborder-radius: 50%-webkit-border-radius: 50%-moz-border-radius: 50%position: fixed}.love:after{top: -10px}.love:before{left: -10px}"), o(), r()
//上面是调用c()并传入了一串css样式与过渡动画,并一起调用o()r()
}
function r() {
/*下面这个for就是遍历整个d,因为与执行代码写在了一行,所以省略{},后面的 ? : 为三元运算符 而后面大意为:判断绘画的图像是否透明,如果是,将其移除,如果不是再传入参数绘画*/
for (var e = 0 e < d.length e++) d[e].alpha <= 0 ? (t.body.removeChild(d[e].el), d.splice(e, 1)) : (d[e].y--, d[e].scale += .004, d[e].alpha -= .013, d[e].el.style.cssText = "left:" + d[e].x + "pxtop:" + d[e].y + "pxopacity:" + d[e].alpha + "transform:scale(" + d[e].scale + "," + d[e].scale + ") rotate(45deg)background:" + d[e].color + "z-index:99999")
requestAnimationFrame(r)
//requestAnimationFrame()是一个请求动画的API,而其中的 r 就是指调用r()
}
function o() {
//这里的=是赋值,==是判断,而&&是逻辑运算符,而typeof返回的是数据类型 注:这的e应指window对象
var t = "function" == typeof e.onclick && e.onclick
e.onclick = function (e) {
t && t(), i(e)
}
}
//创建div并添加class为love,再向d中添加一串对象(用于r()的绘画)
function i(e) {
var a = t.createElement("div")
a.className = "love", d.push({
el: a,
x: e.clientX - 5,//注:这的e应指window对象
y: e.clientY - 5,
scale: 1,
alpha: 1,
color: s()
}), t.body.appendChild(a)//添加了a这个子节点
}
function c(e) {
var a = t.createElement("style")//简化代码
a.type = "text/css"
try {
a.appendChild(t.createTextNode(e)/*添加了一个内容为e的文本节点*/)//并作为a的子节点
} catch (t) {//这里的t纯属需要,无实意
a.styleSheet.cssText = e
}
//这的try catch语句意义为如果上文的e无法添加,则会将a.styleSheet.cssText赋值为e
t.getElementsByTagName("head")[0].appendChild(a)
//getElementsByTagName("head")[0].appendChild(a) 表在第一个head处添加子节点a
}
function s() {
return "#cc2a5d"//这只返回一个颜色=>RGB(204,42,93)
}
var d = []
//下面这个是对requestAnimationFrame方法进行了一个全面兼容 ||也是个逻辑运算符
e.requestAnimationFrame = function () {
return e.requestAnimationFrame || e.webkitRequestAnimationFrame || e.mozRequestAnimationFrame || e.oRequestAnimationFrame || e.msRequestAnimationFrame || function (e) {
setTimeout(e, 1e3 / 60)//这的e应指是window对象
}
}(), n()
}(window, document)//这的window对应参数e,document对应参数t
// rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")
//顺便说一下上面应是生成随机颜色
html页面中 查看源代码 看到有 html注释,这样的注释虽被看到,但是不会被执行。html注释为:<!-- 注释内容 -->
<script>
这种范围内的注释是 js注释,它虽然能看到 也不会被执行。
有多行注释:
/**
*
*
*/
单行注释://
</script>