<!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="width: 100px;height: 100px;background: red;"></div>
<script>
function test(){
	alert("test方法被执行了");
}
</script>

碎片加载中.js

function loading(){
	alert('加载中...');
}