作完就感受本身就是欠練。。。作題的時候着急。頭腦一片白啥也想不起來了。只用了最簡單的辦法作還出了問題。。好比什麼審題啊。又或者連題意我都沒讀明白就開始作了，題很簡單。可是錯在我本身。。把這道題粘出來之後作個教訓吧。。。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