自制一個 簡易jQuery 的 API
阿新 • • 發佈:2018-12-28
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>簡易jQuery</title> <style> .blue { color: blue; } .red { color: red; } </style> </head> <body> <div>123</div> <div>123</div> <div>123</div> <div>123</div> </body> <script> window.jQuery = function (divs) { let div = {} if (typeof divs === 'string') { let temp = document.querySelectorAll(divs) console.log(temp)for (let i = 0; i < temp.length; i++) { div[i] = temp[i]; } div.length = temp.length } else if (divs instanceof Node) { div = { 0: divs, length: 1 } } div.addClass = function (classes) { classes.forEach((value)=> { for (let i = 0; i < div.length; i++) { div[i].classList.add(value) } }) } div.text = function (text) { if (text === undefined) { var texts = [] for (let i = 0; i < div.length; i++) { texts.push(div[i].textContent) } return texts } else { for (let i = 0; i < div.length; i++) { div[i].textContent = text; } } } return div } var $div = jQuery("div") $div.addClass(['red']) $div.text('hi') </script> </html>