javascript - 有没有办法像JQuery中的链接方法一样高效地表达Javascript代码？

Question

在 jQuery 中，我们可以在一条语句中运行多个方法，以便高效地表达 jQuery 代码:

$("#p1").css("color", "red").html("Hello world!").attr("class","democlass");

Javascript 怎么样？

document.getElementById("p1").style.color = "red";
document.getElementById("p1").innerHTML = "Hello world!";
document.getElementById("p1").setAttribute("class","democlass");

Answer 1

性能提升只是因为您只搜索元素一次，然后将其存储在变量中。 jQuery 通过重复将该变量返回给您来使此操作变得简单，但是无论有或没有 jQuery，您都可以使用显式变量来达到相同的效果。

没有 jQuery:

var p1 = document.getElementById("p1");
p1.style.color = "red";
p1.innerHTML = "Hello world!";
p1.setAttribute("class","democlass");

使用 jQuery:

var p1 = $("#p1");
p1.css("color", "red");
p1.html("Hello world!");
p1.attr("class","democlass");