web开发中的一些技术杂项整理文章

所属分类: 网页制作 / CSS 阅读数: 1068
收藏 0 赞 0 分享
1.get()和post()区别:
(1).get请求会将参数放在URL之后进行传递,而post方式是作为http消息实体发送给Web服务器,但是,这种区别在ajax中对用户是不可见的。
(2).get请求方式对传输的数据有大小限制,通常不能大于2KB,而是用post的方式一般不受限制。
(3).get请求的数据会被浏览器缓存起来,因此其他人就可以通过浏览器的历史记录读取这些数据,例如帐号密码等,严重的可能会带来安全问题,而post方式相对就可以避免这些问题。
(4).get方式和post方式传递的数据在服务器端获取的方式也可能不相同,如php,$_GET[]获取get请求,$_POST[]获取post请求。但是JSP是相同的。
(5).get请求提交的速度要比post速度快,但不是差异特别大,在对速度要求比较苛刻的条件下,如搜索引擎,对搜索请求就会采用get方式提交。
(6).HTTP/1.1协议规定了八种请求方式,分别是:options,head,get,post,put,delete,trace,connect,但get和post方式是使用最多的方式。
2.jQuery解析xml和json注意事项:
在使用新版本的jQuery(1.7.2,不是很清楚到底从哪个版本开始这样规定的)采用$.get()解析xml数据时,通常js文件中书写的方式是:
Js代码
1. $.get("jsp/get2.jsp",{
2. "username":encodeURI($("#username").val()),
3. "content":encodeURI($("#content").val())
4. },function(data, textStatus){
5. var username = $(data).find("comment").attr("username");
6. var content = $(data).find("comment content").text();
7. username = decodeURI(username);
8. content = decodeURI(content);
9. var txtHtml = "<div class='comment'><h6>"+username+":</h6><p class='para'>"+content+"</p></div>";
10. $("#resText").html($("#resText").html()+txtHtml);
11. },"xml");
服务器端(JSP)需要返回一个XML文件或者构建出一个XML文件,方式如下:
Html代码
1. <%@page contentType="text/xml" language="java" pageEncoding="UTF-8"
2. import="java.util.Date,java.text.SimpleDateFormat"%>
3. <%
4. response.setContentType("text/xml");
5. String username = request.getParameter("username");
6. String content = request.getParameter("content");
7. //需要注意的是下面的标记不需要了,带上的话就会报错了
8. //out.println("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
9. if(content!=null && !content.trim().equals("")){
10. if(username==null || username.trim().equals("")){
11. username = "匿名人士";
12. }
13. Date now = new Date();
14. SimpleDateFormat sdf = new SimpleDateFormat("yyyy年MM月dd日 HH:mm:ss");
15. out.println("<comments>");
16. out.println("<comment username=\""+username+" 发表于 "+sdf.format(now)+"\">");
17. out.println("<content>"+content+"</content>");
18. out.println("</comment>");
19. out.println("</comments>");
20. }
21. %>
需要注意的内容已经在注释中标记出来了,不然的话浏览器会报出XML文件解析失败的错误。
json文件的解析重点注意的是服务端,js代码如下:
Js代码
1. //重要!!!在新版本的jQuery中,采用了更为严格的json解析方式,所以所有内容都必须要有双引号。
2. //必须形如:{"key" : "28CATEGORY","status" : "0"}
3. $("#send3").click(function(){
4. $.get("jsp/get3.jsp",{
5. "username":encodeURI($("#username").val()),
6. "content":encodeURI($("#content").val())
7. },function(data, textStatus){
8. var username = data.username;
9. var content = data.content;
10. username = decodeURI(username);
11. content = decodeURI(content);
12. var txtHtml = "<div class='comment'><h6>"+username+":</h6><p class='para'>"+content+"</p></div>";
13. $("#resText").html($("#resText").html()+txtHtml);
14. },"json");
15. });
按照上述的注意说明,JSP代码应该为:
Html代码
1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
2. <%
3. String username = request.getParameter("username");
4. String content = request.getParameter("content");
5. out.println("{ \"username\" : \""+username+"\" , \"content\" : \""+content+"\"}");
6. %>
摘自 yiyiboy2010
更多精彩内容其他人还在看

CSS配合JavaScript做酷的动态页面效果

  利用CSS配合JavaScript的可以做很多更酷的动态页面效果,在本教程的最后给大家简单介绍一下CSS配合JS的应用。首先,要搞清楚事件和动作的概念。在客户端脚本中,JavaScript 通过对事件进行响应来获得与用户的交互。例如,当用户单击一个按钮或者在某段文字上移动鼠标
收藏 0 赞 0 分享

WEB标准,Web前端开发工程师必备技术列表

  想要打造并拥有一流的Web产品开发团队,在团队成员基础能力上一定要下功夫。对于Web前端产品开发来说,仅仅掌握Web1.0时代简单的"网页套接"是完全不够的。我结合自己的团队配备,特此罗列了Web前端产品工程师所涉及的技能列表如下:   通过许多实际项目,
收藏 0 赞 0 分享

用CSS制作Alpha滤镜测试板

alpha滤镜给制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦,本文介绍了一种简单的方法。制作一个“Alpha滤镜参数测试板”,在测试板上输入参数
收藏 0 赞 0 分享

非常流行的所谓的气泡窗口

普通的Alt无法自定义风格,而Sweet Titles通过JS脚本与CSS的集合.自定义了这种伪Alt风格. 前一段时间非常流行的,就所谓的气泡窗口(鼠标移到链接处出现的). 我们这里实现的用的是Sweet Titles的插件.显示效果完全由CSS控制.. 先下载Sweet Ti
收藏 0 赞 0 分享

CSS教程:li和ul标签用法举例

LI代码的格式化: A).运用CSS格式化列表符: ul li{ list-style-type:none; } B).如果你想将列表符换成图像,则: ul li{ list-style-type:none; list-style-image: url(/blog/images/
收藏 0 赞 0 分享

CSS教程:CSS中的定位(position)

  使用CSS来定位页面内层的位置,一直是比较难以掌握的事情,很多时候,往往被绝对定位的元素,总是以浏览器的左上角为坐标原点,此时,如果浏览器的大小改变,被定义的层就会偏离设计想要的位置,让人很挠头。   其实,要想控制好层的绝对定位,只要理解CSS中关于定位
收藏 0 赞 0 分享

CSS教程:盒模型(BOX Model)

  如果想熟练掌握DIV和CSS的布局方法,首先要对盒模型有足够的了解。每个HTML元素都可以看作一个装了东西的盒子,盒子里面的内容到盒子的边框之间的距离即填充(padding),盒子本身有边框(border),而盒子边框外和其他盒子之间,还有边界(margin),如图1所示。
收藏 0 赞 0 分享

无延迟翻滚的图形与CSS混合风格按钮

  在一个具有图形背景的按钮中添加CSS风格的文本,这种建立按钮的方法结合了具有CSS翻滚(CSS rollover)标记的开发速度和效率,从而有效地提高按钮外表图像的三维效果。   相比于常规的图形按钮,这些图形/CSS混合按钮可易于建立和载入,因为你只需要为空白按钮外面
收藏 0 赞 0 分享

css里expression实现界面对象的批量控制

用过css样式我们就知道, 可以定义一批对象的class属性来指定同一个样式来统一界面. 但如何统一同类型的对象的事件? 比如:界面有无数个 <img src="**.jpg"> 如何实现鼠标经过此图片, 图片的src变成是**_over.jpg?
收藏 0 赞 0 分享

CSS教程:水平对齐(text-align)

  水平对齐(text-align),用以设定元素内文本的水平对齐方式。   1.语法   text-align具体参数如下: 语法:text-align:left|right|center|justify 说明:设定元素内文本的水平对齐方式。 参数:left:左
收藏 0 赞 0 分享
查看更多