做完就感觉自己就是欠练。。。做题的时候着急。头脑一片白啥也想不起来了。只用了最简单的办法做还出了问题。。比如什么审题啊。又或者连题意我都没读明白就开始做了，题很简单。但是错在我自己。。把这道题粘出来以后做个教训吧。。。
实现一个方法genCssSelector，可以根据一个给定的元素生成一个CSS选择器，通过这个选择器可以快速定位到这个元素（document.querySelector(A)）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="page">
<div class="content main">
<div class="refer">
<ul>
<li></li>
<li></li>
...
</ul>
</div>
</div>
</div>
</body>
</html>
根据上述HTML结构，完善如下JavaScript代码中的“your code here”部分，使得click事件中的注释要求符合预期：
var genCssSelector = function(){
// your code here
}
document.addEventListener(‘click‘, function(e){
//点击li时，返回：html body #page .content.main .refer ul li
console.log(genCssSelector(e.target));
})
当时提交的方法我就不粘了。。就是个小白感觉都比我答的好。。粘一个我最后几分钟读明白题才想好的办法代码吧。当然已经来不及了。
var genCssSelector = function(e){
var obj = document.querySelector(e.tagName);
var str =[];
var i=0;
while(1){
if(obj.parentNode==null||obj.parentNode==‘‘||obj.parentNode==undefined){
break;
}else{
if(obj.className){
str[i] = ‘.‘+obj.className.replace(‘ ‘,‘.‘);
}else{
if(obj.id){
str[i] = ‘#‘+obj.id;
}else{
str[i] = obj.tagName;
}
}
i++;
obj = obj.parentNode;
}
}
str.reverse();
return str.toString().replace(/,/g,‘ ‘).toLowerCase();
}
document.addEventListener(‘click‘, function(e){
//点击li时，返回：html body #page .content.main .refer ul li
console.log(genCssSelector(e.target));
})
基本功还是不行，还是欠缺锻炼，看来还得多打代码了。
原文地址：https://www.cnblogs.com/acefeng/p/8626813.html