//本题相当于从内到外一级一级的向外回退
//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;
}