Javascript 在单击按钮时调整div的大小，是否应该使用AJAX？

我想从客户端调整div的大小，它的默认值是height:500px，单击我的按钮将其设置为height:700px

这是一个asp.net网站

我被要求使用AJAX来完成这项工作，我不清楚这是否意味着使用Microsoft AJAX库中的客户端javascript，或者这是否意味着使用服务器端AJAX进行部分回发

如果我打开IE开发者工具并调整div元素的内联css height:500px属性，网格可以调整得很好

<div id="myDiv" style="position: relative; width: 100%; height: 500px; overflow: hidden;">

如果使用AJAX实现，有哪些选项？JavaScript、JQuery，使用其中一种有什么好处

---

编辑：谢谢

您可以使用纯Javascript，也可以使用jQuery或其他客户端库。往返服务器将浪费资源。Ajax（异步Javascript和XML）在这里似乎是一种浪费，而客户端Javascript可以做到这一点

使用jQuery，您的代码将是：

$("#button").click(function() {
    $("#myDiv").style('height','700px');
});

或者，您的样式实际上应该位于外部CSS文件中。在该文件中，您将有：

#myDiv {
    position: relative;
    width: 100%;
    overflow: hidden;
}
.myDivStartHeight {
    height: 500px;
}
.myDivNewHeight {
    height: 700px;
}

您的HTML最初将

myDivStartHeight

类（使用更具语义的名称）分配给

myDiv

。然后你可以做：

$("#button").click(function() {
    $("#myDiv").removeClass("myDivStartHeight").addClass("myDivNewHeight");
});

如果您不需要jQuery，也可以在纯Javascript中完成这项工作，而不需要jQuery

button.onclick = function() {
    var div = document.getElementById("myDiv");
    if(div) {
        div.style.height = "700px";
    }
};

---

如果没有jQuery，您就可以自由地管理更多的浏览器差异，这不会非常有趣。然而，jQuery确实为代码添加了一些位，有时它可能会被过度使用

您所说的都是javascript，是的，应该使用javascript来完成

您可以直接在div元素中编写内联javascript，也可以编写函数来完成这项工作，并将其称为onclick