'use strict';

 class View{

     constructor(){

     }

     //创建html元素
addEl(fel, elemName, id, cls){
//创建一个元素
let el = document.createElement(elemName);
//设置el id 和 class
if(id){el.setAttribute('id',id);}
if(cls){el.className = cls;}
//把el添加到fel并显示(渲染el)
if(fel){fel.appendChild(el);}
return el;
} //删除html元素
delEl(){
let k, arg = arguments, err = [];
for(k = 0; k < arg.length; k++){
if(this.isEl(arg[k]) === false){err.push(arg[k]); continue;}
arg[k].parentNode.removeChild(arg[k]);
}
if(err.length > 0){return {err:'这里有一些删除失败的元素', arr:err};}
return true;
} //id获取html元素
getEl(id){
return document.getElementById(id);
} //通过parentNode检查元素是否存在于页面中
isEl(el){
if(typeof(el) !== 'object'){return false;}
//被删除之后的html元素object的 parentNode等于null
if(!el.parentNode){return false;}
return true;
} //元素绑定事件
addEvent(target, callback){
//target.addEventListener('click', function(event){if(callback){callback(event);}}, false);
} } let v = new View(); console.log('创建元素');
let el_a = v.addEl(document.body, "p");
let el_b = v.addEl(document.body, "p");
let el_c = v.addEl(document.body, "p"); console.log('验证元素_0');
console.log(v.isEl(el_a));//true
console.log(v.isEl(el_b));//true
console.log(v.isEl(el_c));//true console.log('删除元素_0');
console.log(v.delEl(el_a, el_b));
console.log(v.delEl(el_c)); console.log('验证元素_1');
console.log(v.isEl(el_a));
console.log(v.isEl(el_b));
console.log(v.isEl(el_c)); console.log('删除元素_1');
console.log(v.delEl(el_a, el_b));
console.log(v.delEl(el_c));
04-19 23:49
查看更多