<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="jquery-2.2.4.min.js"></script> <script> /* get 和post 请求,就简单调用方法就行*/ $(window).load(function() { $('#btn').on('click', function() { $.get('http://localhost/myservice/jQueryAjax.php', { 'name': $('#inputID').val() }, function(d) { $('#spanID').text('结果是:' + d); }).error(function(e){ console.log(e); }); }); }); </script> </head> <body> <input type="text" id="inputID" /> <br/> <button id="btn">Send</button> <span id="spanID"></span> </body> </html>
加载碎片
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script src="jquery-2.2.4.min.js"></script> <script> $(document).ready(function(){ //加载碎片,加载远程html元素,还能执行其中的JS方法 $('body').load('box.htm',function(a,status,c){ console.log(status); test(); }) //加载另外的js文件 $.getScript('碎片加载中.js',function(){ //调用JS方法 loading(); }); }); </script> </head> <body> </body> </html>
box.htm
<div style=" 100px;height: 100px;background: red;"></div> <script> function test(){ alert("test方法被执行了"); } </script>
碎片加载中.js
function loading(){ alert('加载中...'); }