作完就感受本身就是欠练。。。作题的时候着急。头脑一片白啥也想不起来了。只用了最简单的办法作还出了问题。。好比什么审题啊。又或者连题意我都没读明白就开始作了，题很简单。可是错在我本身。。把这道题粘出来之后作个教训吧。。。html
实现一个方法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));
})spa
当时提交的方法我就不粘了。。就是个小白感受都比我答的好。。粘一个我最后几分钟读明白题才想好的办法代码吧。固然已经来不及了。code
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)); })
基本功仍是不行，仍是欠缺锻炼，看来还得多打代码了。htm