初次使用AJAX

  最近在做一个项目的改进，有个web页面上有一张图表。这个图表是由javascrip画的，显示在web的主页上。之前为了想要先看看图表出来的效果，将图表的一些参数都使用常量写死。现在想通过调用后台mysql数据库，将参数和后台数据关联。当数据发生变化时，就能够实时的通过图表看到效果。

   实现起来也无非是简单访问数据库，操作难度不高。查了一些解决方案，这种类似问题的解决方法是靠js + Ajax + PHP + Mysql 这种架构来实现。在这种方法中，js用来实现页面绘图功能，Ajax应用能够实时的改变网页内容，而不用不停的点刷新按钮，PHP作为后台的功能实现，通过调用数据库并将结果反馈给前台。

 

原有的JS是实现画图的功能：

 

var chart;

$(document).ready(function() {

chart = new Highcharts.Chart({

chart: {

...

};

...});

...});

 

在原有的JS中加入以下代码：

 

 

var xmlHttp

function getPara(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
 {
 alert ("Browser does not support HTTP Request")
 return
 }
var url="getSql.php"
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
 { 
    //数据库参数处理 xmlHttp.responseText 

 } 
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
 {
 // Firefox, Opera 8.0+, Safari
 xmlHttp=new XMLHttpRequest();
 }
catch (e)
 {
 //Internet Explorer
 try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
 catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 }
return xmlHttp;
}

代码解释：getPara()函数用来调用GetXmlHttpObject函数来创建XMLHTTP对象，定义发送到服务器的URL，添加一个随机数，以防服务

器使用缓存的文件，当触发事件时调用stateChanger，通过给定的URL打开XMLHTTP对象，向服务器发送HTTP请求。

getSql.php 是由JS通过AJAX调用后台的实现数据库访问的php文件。
基本代码如下：
<?php

$con = mysql_connect('localhost', 'sa', 'xxxxxx');
if (!$con)
 {
 die('Could not connect: ' . mysql_error());
 }

mysql_select_db("xxx", $con);

$sql="SELECT * FROM user WHERE xxx = xxx";

$result = mysql_query($sql);

while($row = mysql_fetch_array($result))
 {
 //向前台输出内容 echo "" ; 
 }

mysql_close($con);
?>
在下才疏学浅，初次使用ajax，还有很多东西弄的不明白，相信随着接触的次数增多会更增进熟悉程度。有个问题是，能不能不通过ajax，
直接由JS对数据库进行访问？看了一些文章，说是容易造成安全漏洞，网上多推荐使用ajax。