阿裏的前端前期小測驗
做完就感覺自己就是欠練。。。做題的時候著急。頭腦一片白啥也想不起來了。只用了最簡單的辦法做還出了問題。。比如什麽審題啊。又或者連題意我都沒讀明白就開始做了，題很簡單。但是錯在我自己。。把這道題粘出來以後做個教訓吧。。。
實現一個方法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)); })
基本功還是不行，還是欠缺鍛煉，看來還得多打代碼了。
阿裏的前端前期小測驗