旗下品牌:
石家庄网站开发 石家庄网站开发公司

资讯动态

察而思、思而行、行而后语、知行合一

通过ajax输出公共头部和底部

发布时间:2020-06-08 热度:

  网站建设对于企业来说是必不可少的宣传方式,但是很多人对于网站建设有很多好奇,也有一些技术人员有一些不太懂的问题,今天,石家庄网站建设工程师就来给您详细介绍以下内容。

  在一些页面里面,我们经常会遇到一些相同部分,而且是大批量的,如果一个一个修改,太耗时间,那么我们怎么把这些公共起来,便于维护呢?

通过ajax输出公共头部和底部

  这是我通过ajax的方法,来获取指定div,把一些公共的部分输出:

  这里指定了头部和底部

  //指定头部

  $(function(){

  $.ajax({

  type:"get",

  url:"../js/header.html",

  dataType:"html",

  async:false,

  success:function(data){

  $(".header").append(data);

  }

  });

  })

  //指定底部

  $(function(){

  $.ajax({

  type:"get",

  url:"../js/footer.html",

  dataType:"html",

  async:false,

  success:function(data){

  $(".footer").append(data);

  }

  });

  })

  但是上面的这个方法太冗余了,如果多个写的更多,那么我们可以合并一下代码:

  $(function(){

  function getHtml(part){

  $.ajax({

  type:"get",

  url:"../js/"+ part +".html",

  dataType:"html",

  async:false,

  success:function(data){

  $("." + part).append(data);

  }

  })

  }

  getHtml('header');//输出头部

  getHtml('footer');//输出底部

  });

  注:这里我们的ajax是通过jq写的,所以页面一定要引入jq文件。

  以上就是今天石家庄网站建设开发人员跟您分享的内容,希望能对大家的网页设计方面能有所帮助。如果您需要做网站,欢迎您来石家庄尚武科技咨询,我们将竭诚为您服务!

联系尚武科技
客户服务
石家庄APP开发
400-666-4864
为您提供售前购买咨询、解决方案推荐等1V1服务!
技术支持及售后
石家庄APP开发公司
0311-66682288
为您提供从产品到服务的全面技术支持 !
客户服务
石家庄小程序开发
石家庄小程序开发公司
加我企业微信
为您提供售前购买咨询、
解决方案推荐等1V1服务!
石家庄网站建设公司
咨询相关问题或预约面谈,可以通过以下方式与我们联系。
石家庄网站制作
在线联系:
石家庄Web开发
石家庄软件开发
石家庄软件开发公司
ADD/地址:
河北·石家庄
新华区西三庄大街86号河北互联网大厦B座二层
Copyright © 2008-2025尚武科技 保留所有权利。 冀ICP备12011207号-2 石家庄网站开发冀公网安备 13010502001294号《互联网平台公约协议》
Copyright © 2025 www.sw-tech.cn, Inc. All rights reserved