关于前端:HTML-DOM-querySelectorAll-代替-jquery的-CSS选择器

36次阅读

共计 900 个字符，预计需要花费 3 分钟才能阅读完成。

querySelectorAll() 办法返回文档中匹配指定 CSS 选择器的所有元素，其成果与 jquery 的 $(”) 选择器一样，不同的就是 querySelectorAll() 办法是 Js 原生办法，无需引入 jquery.min.js 库。

<!DOCTYPE html>
<html>
<head>
    <title>demo</title>
    <meta charset="utf-8">
    <script type="text/javascript" src="jquery.min.js"></script>
</head>
<body>
    <div id="a">666</div>
    <script type="text/javascript">
        var a = $('#a').text();
        alert(a)
    </script>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
    <title>demo</title>
    <meta charset="utf-8">
</head>
<body>
    <div id="a">666</div>
    <script type="text/javascript">
        var a = document.querySelectorAll('#a');
        alert(a[0].innerText)
    </script>
</body>
</html>

为什么 jquery 会越来越少人用，甚至不少前端程序员开始厌弃 jquery，还是与原生 Js 的倒退无关，原生 Js 操作 Dom 的 API 是越来越不便了。

jquery 的 Ajax 操作，为咱们省去了兼容浏览器方面的问题，并且也提供了扼要的 API 去调用 get 和 post，让开发者从繁琐的兼容性与应用原生 API 上解脱进去。

然而当初，这个劣势也曾经十分渺小了。不论是原生 js 的 fetch API 还是 axios，都为咱们提供了弱小的 Ajax 应用能力，并且 axios 还有拦截器这个劣势。相较而言，jquery 的 Ajax 的确曾经无奈相比了。

无关 Fetch Api 的，能够看我上一篇文章：https://segmentfault.com/a/11…

正文完