Can we change the content of the page without using AJAX [closed] - ajax

Question

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I mainly use AJAX to update parts of a web page, without reloading the whole page.
can i do it without using AJAX

Answer 1

Please refer, Refresh content of a div without ajax
If something is to be done in server side without refresh you should be using AJAX. Else you can simply use javascript codes.
For show/hide content(if nothing to be done in server side), you can just simply use javascript codes or jquery.
eg.
simple javascript
document.getElementById('myContent').display = 'none';
document.getElementById('myContent').display = 'block';
jquery
$('#myContent').hide();
$('#myContent').show();
where myContent is the content element id

Answer 2

If you don't need any new information from the server, just use JavaScript to manipulate the DOM. Add event handlers to your HTML elements to trigger your JavaScript code.
One example to get new information from the server and feed it to your JavaScript: add <script src="..."> node to the DOM.
If you want to change images only, then change the .src attribute of a DOM image, or create a new Image from JavaScript and add it to the DOM.
If you want to draw something onto a rectangle, create a <canvas> element and draw to it using JavaScript.
Possibly there are many other ways.

Answer 3

Yes. I have often done this e.g. using a tabbed menu therefore the header, footer and menu stay the same but the content changes. I did this by wrapping a class around both pieces of content, I then displayed:none; on one of the classes which causes it to hide. Then on click of your choice, using a jquery function within a javascript function, you can then toggle between the two classes which effectively gives you a content change. It works perfect for me see what you think. Here is the code:
function doSlide()
{
$('#sidepanel').toggleClass("hidesidepanel showsidepanel", 1000);
$('#maincontent').toggleClass("show maincontent hidemaincontent", 1000);
$('#openmenu').toggleClass("openmenuleft openmenuright", 1000);
}