天天看点

阿里前端实习笔试题

//本题相当于从内到外一级一级的向外回退

//while循环中先判断元素的id是否为空,然后在判断class是否为空,若不为空则名字增长

//每个符合小的条件的最后一句的在将元素向上移

var genCssSelector = function() {

//you code here

let ele = arguments[0];//获取被点击的元素(li)

//let相当于定义了一个块内变量,不会像var声明变量时会发生变量提升,所以本代码均使用let声明变量

let parentEle = ele.parentNode;//获取li的父元素ul

let CSelector = ele.tagName.toLowerCase();//将li转换成小写字母

while(parentEle.nodeName.toLowerCase() !== '#document') {

//注意:这里为什么是判断是否等于‘#document’是因为html的父元素的nodeName就是‘#document’

//所以条件成立是就应该停止循环了

//上面是在判断 当ul不等于‘document’时进入下面的循环,这里为什么要这样判断啊?

if(parentEle.id !== '') {//用来判断ul元素的id是否为空,由html页面可知ul的id为空

CSelector = '#' + parentEle.id + ' ' + CSelector;

parentEle = parentEle.parentNode;

continue;

} else if(parentEle.className) {//parentEle.className等于空

CSelector = ' ' + CSelector;//CSelector=' ul'

let classList = parentEle.classList || parentEle.className.split(' ');

for(var i = classList.length - 1; i >= 0; i--) {

CSelector = '.' + classList[i] + CSelector;

}

parentEle = parentEle.parentNode;

continue;

} else {

CSelector = parentEle.nodeName.toLowerCase() + ' ' + CSelector;

//第一次while循环直接进入CSelector等于ul li

parentEle = parentEle.parentNode;//parentEle就等于ul的父元素 div.refer

continue;

}

}

return CSelector;

}