javascript ajax 面试题集

最新推荐文章于 2023-02-01 22:39:58 发布

conkeyn

最新推荐文章于 2023-02-01 22:39:58 发布

阅读量206

点赞数

文章标签：面试 Ajax JavaScript Google Safari ViewUI

本文链接：https://blog.csdn.net/conkeyn/article/details/83492281

版权

1、写一段 Ajax 程序，页面左方是一个用户列表，页面右方是三个用户分组，可以通过拖拽用户，将用户分配到不同的组，一个用户只可以属于一个分组，或不属于任何分组。一个用户必需且仅可以在页面上出现一次。最后可以把结果提交到服务器端。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here </title>

<script type="text/javascript">
// div拖拽
function tuozhuai() {
	r4.style.top = event.clientY - DragDiv_orgY;
	r4.style.left = event.clientX - DragDiv_orgX;
}
var DragDiv_orgY = 0;
var DragDiv_orgX = 0;

// 现实影子
function show() {
	var ele = event.srcElement;
	r4.innerHTML = ele.outerHTML;
	ele.parentElement.removeChild(ele);
	DragDiv_orgX = -1;
	DragDiv_orgY = -1;
	r4.style.top = event.y - DragDiv_orgY;
	r4.style.left = event.x - DragDiv_orgX;
	r4.style.display = '';
}

// 放入左边
function fang() {
	var ele = event.srcElement;
	var username = '';
	if (r4.style.display == '') {
		while (ele.tagName != 'TD') {
			ele = ele.parentElement;
		}
		username = r4.children[0].innerText;
		ele.innerHTML += r4.innerHTML;
		// /你要用ajax调后台的话就在这里写代码 后台就简单了 把username传到后台 写个sql就删了 或 添加了
		// 
		if (ele.id != '')
			user.value = '用户' + username + '加入第' + ele.id + '组';
		else
			user.value = '用户' + username + '移出组';
		// //
	}
	r4.style.display = 'none';
	r4.innerHTML = '';
}
</script>

</head>
<body  οnmοusemοve='tuozhuai()'  οnmοuseup=fang() >
<div  id='r4'  style="display:none;position: absolute;top:150px;left:40px; z-index:1002;filter: alpha(opacity=50);border:1 #999999 solid; word-break:break-all;"> </div>
<input id=user  size=100  > </input>
<table border=1 width=100% height=100%>
    <tr  height=100%  >
        <td  width=50%  >
            <div border=1 οnmοusedοwn='show()' >user11111111111111111111111111 </div>
            <div border=1 οnmοusedοwn='show()'>user2222222222222222222222222222 </div>
            <div border=1 οnmοusedοwn='show()'>user3333333333333333333333333 </div>
            <div border=1 οnmοusedοwn='show()'>user4444444444444444444444444 </div>
        </td>
        <td width=50%  >
            <table  height=100%  width=100%  border=1>
                <tr>
                    <td  id=1>1 </td>
                </tr>
                <tr>
                    <td  id=2>2 </td>
                </tr>
                <tr>
                    <td  id=3>3 </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>

2、介绍一下XMLHttpRequest对象

通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新。

AJAX开始流行始于Google在2005年使用的”Google Suggest”。

“Google Suggest”就是使用XMLHttpRequest对象来创建动态的Web接口：

当用户开始输入google的搜索框，Javascript发送用户输入的字符到服务器，然后服务器返回一个建议列表。

XMLHttpRequest对象在IE5.0+, Safari 1.2, Mozilla 1.0/Firefox, Opera 8+ 和NetScapt7 开始被支持。

IT公司面试题集。。。。http://www.mianwww.com/