最近学了Ajax,Ajax能够在不刷新页面的状况和服务器通讯,Jquery也有Ajax,下面记录下原生JS的Ajax和JQuery的Ajaxjavascript
这里使用了百度的热搜接口,https://www.baidu.com/su?wd=?&cb=?html
JS原生Ajaxjava
function getData(data){ var script = document.querySelector('#jsonp'); script.parentNode.removeChild(script); $('ul').html(''); for(var i = 0 ;i<data.s.length;i++){ $('<li>'+ data.s[i] +'</li>').appendTo('ul'); console.log("ss"); } } function getList(wd){ var script = document.createElement('script'); script.id = 'jsonp'; console.log(wd); script.src = 'https://www.baidu.com/su?cb=getData&wd=' + wd; document.body.appendChild(script); } $('input').keyup(function(){ var wd = $(this).val(); getList(wd); })
这样经过百度热搜接口查找input的value的热搜;wd=后面跟的就是想要搜索的关键字ajax
在JQuery下Ajax简单多了json
var v = $('input').val(); $.ajax({ type:'get', url:'https://www.baidu.com/su', dataType:'jsonp', jsonp:'cb', data:{ wd:v } }).done(function(resp){ alert(resp.s); })
当时,我input的value是sss,但将wd=sss传过去,返回的内容中s是空的服务器
我觉得没获取到input的value,而后在控制台输出value,确有其值,那就奇怪了,为何没搜到呢,我一度觉得Jquery的ajax下data不能传变量,因此才没把value传到服务器去,结果。。。。。。input的value改为其余的,就能获得返回的s内容。由此得出sss这个字符串估计没人搜。。。。。。。。app