介绍
这篇文章主要为大家展示了“如何通过数据库和ajax方法写出地图”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“如何通过数据库和ajax方法写出地图”这篇文章吧。
<强> ajax教程强>
ajax(异步JavaScript和XML(异步的JavaScript和XML)。
ajax不是新的编程语言,而是一种使用现有标准的新方法。
ajax是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
客户端部分:html、JavaScript、css代码部分:
& lt; ! DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01,过渡//EN" “http://www.w3.org/TR/html4/loose.dtd"比; & lt; html> & lt; head> & lt; title> & lt;/title> & lt; meta charset=癠TF-8"/比; & lt;/head> & lt; !——css样式部分——比; & lt; style 类型=拔谋?css"比; .content_map {/*边境:1 px solid 蓝色;*/宽度:1349 px; 身高:524 px; 浮:左; margin-top: 100 px; } .content_map .mLeft { 边界:没有; border-top: 1 px solid # fb6c20; 宽度:400 px; margin-top: 14 px; 浮:左; margin-left: 134 px; } .content_map>跨度{ margin-left: 20 px; margin-right: 20 px; 字体大小:28 px; 字体类型:“Microsoft Yahei";/*粗细:大胆;*/浮:左; } .content_map .mRight { 浮:左; 边界:没有; border-top: 1 px solid # fb6c20; 宽度:400 px; margin-top: 14 px; } # maplist { margin-top: 50 px; 宽度:749 px; 身高:524 px;/*边境:1 px solid # fb6c20; */背景:,url (/diru.png"“图像),no-repeat 0, 0,; background-size:包含; 位置:,相对; 浮:左; } .mapShop img { 位置:绝对的;/*边境:1 px solid 红色;*/} # map_right {/*边境:1 px solid # fb6c20; */浮:左;/*宽度:600 px; */宽度:594 px; 身高:524 px; background - color: # f0f2fe; margin-top: 40像素; } .shopMsg img { 宽度:450 px; 身高:300 px; margin-left: 72 px; margin-top: 40像素; } .shopMsg .pmname { 颜色:# 000; 字体大小:20 px; margin-top: 30 px; margin-left: 72 px; 字体类型:微软雅黑; } .shopMsg .address { 颜色:# 000; 字体大小:20 px; margin-top: 30 px; margin-left: 72 px; 字体类型:微软雅黑; } .shopMsg .phone { 颜色:# 000; 字体大小:20 px; margin-top: 30 px; margin-left: 72 px; 字体类型:微软雅黑; } & lt;/style> & lt; body> & lt; !——html部分——比; & lt; div 类=癱ontent_map"祝辞 & lt; !——,标题——比; & lt; hr 类=癿Left"/比; & lt; span>相关宠物医院& lt;/span> & lt; hr 类=癿Right"/比; & lt; !——,左边部分:地图——比; & lt; div id=癿aplist"祝辞 & lt;/div> & lt; !——,右边部分点击左边要添加的内容:以及最开始加入的信息——比; & lt; div id=癿ap_right"祝辞 & lt; div 类=皊hopMsg"祝辞 & lt; img  src=https://www.yisu.com/zixun/巴枷?w_map.png "/>宠物店名:Petjoy宠物社区地址:长宁区机旋路1258号- 1260号电话号码:53018000 (021)