在前端开发中，可以使用以下几种方法实现不重新加载页面而切换页面：

1. 使用Ajax加载内容：通过Ajax技术向服务器请求新页面内容，然后使用JavaScript将新内容替换当前页面的内容。这样可以实现页面的切换，而不需要重新加载整个页面。

// 使用jQuery的ajax方法示例
$.ajax({
  url: 'newpage.html', // 请求新页面的URL
  success: function(data) {
    // 将新内容替换当前页面的内容
    $('#content').html(data);
  }
});

2. 使用Vue.js或React等前端框架：这些框架可以通过组件化的方式实现页面的切换，而不需要重新加载整个页面。通过切换组件，可以实现页面间的切换效果。

// 使用Vue.js示例
// 定义两个组件
var Component1 = Vue.extend({
  template: '
Component 1
'
});

var Component2 = Vue.extend({
  template: '
Component 2
'
});

// 创建Vue实例
new Vue({
  el: '#app',
  data: {
    currentComponent: Component1 // 当前显示的组件
  },
  components: {
    'component1': Component1,
    'component2': Component2
  },
  methods: {
    switchComponent: function() {
      // 切换组件
      this.currentComponent = (this.currentComponent === Component1) ? Component2 : Component1;
    }
  }
});

3. 使用单页应用（Single Page Application，SPA）框架：如AngularJS、Vue.js的路由功能。这些框架通过使用路由机制，可以在不重新加载整个页面的情况下切换不同的页面。

// 使用Vue.js的路由示例
// 定义两个组件
var Component1 = {
  template: '
Component 1
'
};

var Component2 = {
  template: '
Component 2
'
};

// 创建Vue实例，并配置路由
var router = new VueRouter({
  routes: [
    { path: '/component1', component: Component1 },
    { path: '/component2', component: Component2 }
  ]
});

// 将路由挂载到Vue实例中
new Vue({
  el: '#app',
  router: router
});

以上是其中几种常见的方法，根据具体的需求和技术栈选择合适的方式来实现不重新加载页面而切换页面。