欢迎来到CClarence的博客！！

敲代码真的是一件令人感到上瘾的事情，在我二十多年的生活中，除了打DoTa，好像没有其他的另一件事也能让我如此乐此不疲。而前端恰恰是编程与界面的最前沿，它能让快速的让你感受到自己的成果，这是一件多么令人兴奋的事啊！！我希望在两年后我毕业的时候我能真的成为一位前端码农，在五年后我能成为一位NB的前端码农！！
----------CClarence写于2015年入冬。

001

JavaScript初学与inserAfter函数 

 
function addLoadEvent(func) { 
var oldonload = window.onload; 
if (typeof window.onload != 'function') { 
window.onload = func; 
} else { 
window.onload = function() { 
oldonload(); 
func(); 
} 
} 
}

上面这段函数是加载后执行函数，无论有多少个函数，只需要在js文件末尾添加addLoadEvent()就可以加载后执行函数了。一句的事！！

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Image Gallery</title>
</head>
<body>
<h1>Snapshots</h1>
<ul>
    <li>
        <a href="image/bone7.jpg" onclick="showPic(this); return false;" title="a famous dota player">bone7</a>
    <li>
        <a href="image/Forever-07.jpg" onclick="showPic(this); return false;" title="a old man">Forever-07</a>
    </li>
    <li>
        <a href="image/HuiYuanAi.jpg" onclick="showPic(this); return false;" title="a beautiful girl">HuiYuanAi</a>
    </li>
    <li>
        <a href="image/GeYOU.jpg" onclick="showPic(this); return false;" title="a funny movie star">GeYOU</a>
    </li>
</ul>
<img id="KeNan" src="image/KeNan.jpg" alt="my image gallery"/>
<script type="text/javascript" src="scripts/showPic.js"></script>
</body>
</html>
function showPic(whichpic)
{
var source=whichpic.getAttribute("href");
var KeNan=document.getElementById("KeNan");
KeNan.setAttribute("src",source);
}

 加入childNodes，为什么先加载一次网页（360安全浏览器）显示数字8，点击确定后又弹出alert显示9呢？然后就没有alert了。不懂。

function showPic(whichpic)
{
var source= whichpic.getAttribute("href");
var KeNan= document.getElementById("KeNan");
KeNan.setAttribute("src",source);
}
function countBodyChildren()
{
    var body_element= document.getElementsByTagName("body")[0];
    alert(body_element.childNodes.length);
    window.onload= countBodyChildren;
    
}

 countBodyChildren();

 编写insertAfter函数

function insertAfter(newElement,targetElement){
    var parent=targetElement.parentNode;
    if(parent.lastChild==targetElement){
    parent.appendChild(newElement);
    }else{
    parent.insertBefore(newElement,targetElement.nextSibling);
    }
}

 

posted @ 2015-10-24 15:54  CClarence  阅读(316)  评论(0)    收藏  举报

最后的战役

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt unde natus dolorem beatae vero asperiores, at magnam facilis veritatis autem! Consequuntur et eligendi optio ea voluptatem autem laborum labore nisi.

东风破

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum quam mollitia explicabo sed, totam consequuntur nisi rerum iure natus porro tempore facere quas, odio quis qui, dolorem eaque consectetur nemo.

东风破

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum quam mollitia explicabo sed, totam consequuntur nisi rerum iure natus porro tempore facere quas, odio quis qui, dolorem eaque consectetur nemo.

东风破

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum quam mollitia explicabo sed, totam consequuntur nisi rerum iure natus porro tempore facere quas, odio quis qui, dolorem eaque consectetur nemo.

东风破

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsum quam mollitia explicabo sed, totam consequuntur nisi rerum iure natus porro tempore facere quas, odio quis qui, dolorem eaque consectetur nemo.