遞歸調用

• 遞歸調用，方法自己調用自己(重復執行方法中的邏輯）
  • 1.在方法內部調用自己的方法寫在return
  • 2.設置邊界條件，讓遞歸調用停下來

function fn(n) {if(n == 1){return 1;}return n + fn(n-1);}console.log(fn(100));//5050 復制代碼 function fn(n) {if(n === 1){return 1;}if(n%2 === 1){return n * fn(n - 2);}else if(n%2 === 0){return fn(n - 1);}}console.log(fn(10));//945 復制代碼

快速排序

• 思路：先取出數組的中間項，將數組的其他項和中間項比較，若比中間項小則放在左手邊，若比中間項大則放在右手邊。左手和右手邊再重復上述操作，最后將所有的數合并在一起。

var a = [1,7,4,5,8,3,77,45,86,93,34,52];//先獲取中間項索引function quickSort(n) {//處理邊界if(n.length <= 1){return n;}var pointIndex = Math.floor(n.length/2);//通過中間索引，把中間項從數組中刪除var pointView = n.splice(pointIndex,1)[0];var left = [];//左手邊var right = [];//右手邊for(var i = 0; i < n.length; i++){if(n[i] <= pointView){left.push(n[i]);}else{right.push(n[i]);}}return quickSort(left).concat(pointView,quickSort(right));}console.log(quickSort(a));//[1, 3, 4, 5, 7, 8, 34, 45, 52, 77, 86, 93] 復制代碼

string案例1

• 如何格式化url地址中問號傳參（qreryString）部分？
  • 1.先拿到？的索引
  • 2.拿到？后的參數部分str
  • 3.將字符串按照&拆分成數組的每一項
  • 4.將ary數組中每一項再按照=拆分成數組的每一項
  • 5.把數組ary1和ary2中的第一項作為屬性名，第二項作為對象的屬性值

var url = "https://www.twitch.tv?name=tw&age=8";function queryUrl(url) {var obj = {};var index = url.indexOf("?");//拿到？的索引var str = url.slice(index + 1);//截取？后的部分var ary = str.split("&");for(var i = 0; i < ary.length; i++){var cur = ary[i];var arr = cur.split("=");obj[arr[0]] = arr[1];}return obj;}console.log(queryUrl(url)); 復制代碼

DOM部分

• 瀏覽器渲染時，頁面上的內容會渲染成有層次結構的節點，一個頁面只有一個根節點document，根節點下根元素只有一個，就是HTML標簽
• 文檔 -> 文檔節點
• 文本 -> 文本節點
• 注釋 -> 注釋節點
• 標簽 -> 元素節點

節點nodeName(節點名稱)nodeType(節點類型)nodeValue(節點內容)

文檔節點	#document	9	null
文本節點	#text	3	文本的內容（包括換行）
注釋節點	#comment	8	注釋的內容
元素節點	大寫的標記名	1	null

DOM節點間相互關系的屬性

• 1.childNodes 所有的子節點（文本節點，元素節點，注釋節點）
• 2.children 所有的子元素
• 3.firstChild 第一個子節點
• 4.firstElementChild 第一個子元素節點 （ie6~ie8不支持）
• 5.lastChild 最后一個子節點
• 6.lastElementChild 最后一個子元素節點
• 7.nextSibling 相鄰弟弟節點
• 8.nextElementSibling 相鄰弟弟元素節點
• 9.previousSibling 相鄰哥哥節點
• 10.previousElementSibling 相鄰的哥哥元素節點
• 11.parentNode 父元素節點

獲取DOM元素

• ID名 document.getElementById("ID名")
• 標記名context.getElementsByTagName("標簽名")
• 類名context.getElementsByClassName("類名")
• name屬性 在標準瀏覽器對所有元素起作用，在IE瀏覽器下只對表單元素起作用
  • context.getElementsByName("")
• 選擇器 document.querySelectorAll() 獲得一組元素 移動端常用 - document.querySelector() 獲得一個元素 移動端常用
• 設置DOM元素的自定義屬性：
  • ele.setAttribute(key,value);
  • ele.getAttribute();

轉載于:https://juejin.im/post/5b8683016fb9a019fe685949

總結

以上是生活随笔為你收集整理的前端基础12：递归调用，快速排序和简单DOM元素操作的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。