1. 程式人生 > >自制一個 簡易jQuery 的 API

自制一個 簡易jQuery 的 API

<!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>