码迷,mamicode.com
首页 > Web开发 > 详细

妙味JS学习记录(二)

时间:2018-04-01 18:55:26      阅读:248      评论:0      收藏:0      [点我收藏+]

标签:log   框架   运动   用户名   class   timer   btn   提交数据   网页   

在学习过程中零碎的知识点记录以及一些想法,加深印象,强化记忆。

五、Ajax

~ 无刷新数据读取;用户注册、在线地图、聊天室、webQQ、微博;

Ajax能且仅能 从服务器读取一个文件,要注意文本文件和网页的编码要统一(utf-8)

只读一次,后面加载缓存,?t=1213 用get提交数据

可以用?t=new Date().getTime 使每次都重新加载;

eval()计算字符串里的值,如果参数是一个表达式,eval() 函数将执行表达式。如果参数是Javascript语句,eval()将执行 Javascript 语句。

原理:

Http请求方法:GET - 获取数据(浏览帖子)  POST - 上传数据(用户注册);

form的action属性是用来确定表单提交到哪里,method属性默认为get

<form action="www.baidu.com" method="get" accept-charset="utf-8">
        用户名:<input type="text" name="user"/>
        密码:<input type="password" name="pass" />
</form>

get方式把数据放到url 里面提交;post把数据放在http content里;

get安全性很低;post安全性一般;

get容量很低;post容量几乎不限

get便于分享;post不便于分享

~ 编写Ajax

1.创建ajax对象  

//创建AJAX对象
var oAjax = null;
if(window.XMLHttpRequest){
//不存在的变量会报错,不存在的属性仅仅是undefined
    oAjax = new XMLHttpRequest();
}else{
    oAjax = new ActiveXObject("Microsoft.XMLHttp");
}

2.跟服务器连接 

 oAjax.open(方法,URL,异步);

3.发送请求

  oAjax.send();  

4.接收返回

oAjax.onreadystatechange = function(){
    if(oAjax.readyState == 4){
        if(oAjax.status == 200){
            alert(‘成功‘+oAjax.responseText); //获得字符串形式的响应数据
        }else{
            alert(‘失败‘);
        }
    }
};

 

六、运动

var timer = null;
var btn = document.getElementById("btn");

function startMove(){
    clearInterval(timer);//先清定时器,防止定时器叠加
    var odiv = document.getElementById("div");
    timer = setInterval(function(){
        var ispeed = 1;     //设定速度
        if (odiv.offsetLeft >= 300) {//到300距离停止
            clearInterval(timer);
        }else{  //用了else到达位置后不执行
            odiv.style.left = odiv.offsetLeft + ispeed +‘px‘;
        }
            
    },30);
}
btn.onclick = startMove;

运动框架

开始运动时,关闭已有定时器,把运动和停止隔开(if..else)

妙味JS学习记录(二)

标签:log   框架   运动   用户名   class   timer   btn   提交数据   网页   

原文地址:https://www.cnblogs.com/anqwjoe/p/8659230.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!