您的位置:首页 > 编程语言

【DOM编程艺术】对styleHeaderSibling函数进行抽象

2014-04-21 21:27 330 查看
把一个非常具体的东西改进为一个较为通用的东西的过程叫做抽象

先看下styleHeaderSibling函数,会发现它仅适用于h1元素,而且className属性值intro也是硬编码在函数里的:

function styleHeaderSibling(){
var headers=document.getElementsByTagName('h1');
for(var i=0;i<headers.length;i++){
var elem=getNextElement(headers[i].nextSibling);  //调用函数获取h1后面的元素节点
addClass(elem,'intro');  //调用函数添加新样式
}
}


把这些具体的值转为函数的参数,就可以让它成为一个更通用的函数。把改进后的新函数命名为styleElementSibling并给它添加两个

参数----tage和theclass:

function styleElementSibling(tag,theClass){
var elems=document.getElementsByTagName(tag);
for(var i=0;i<elems.length;i++){
var elem=getNextElement(headers[i].nextSibling);  //调用函数获取h1后面的元素节点
addClass(elem,theClass);  //调用函数添加新样式
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: