2010年07月26日
by 江小邪
0 comments
AJAX bandwagon是个好去处。它带给你更快、更高效、更强动态的应用。但它也有自身的缺陷。
初一看,具备一些常识似乎就能避免这些缺陷,在一定程度上,的确如此。但从DHTML起源来看,AJAX应用程序充满了结构性差异。不论你在应用程序开发工作中掌握了多少常识,从别人犯的错误中吸取教训也是有好处的。我们称这些错误为“七宗死罪”,但它们不能代表全部的错误。
事实上,在你犯这些致命过失之前,你可能首先犯了一些较轻的错误。因此我们从这里着手。这是每个人都可能犯的错误。这些错误是多么普遍,通过Google搜索一下,你就可以发现大部分的错误。
(更多…)
标签Tags:
ajax,
dhtml,
google,
html,
javascript,
JavaScript&Ajax,
url,
人,
应用程序,
搜索,
新手,
方法,
更新,
浏览器,
程序,
网络编程,
自身,
设计,
诫,
链接,
错误,
页面
JavaScript&Ajax, 网络编程
2010年07月26日
by 江小邪
1 comment
Ajax的核心是JavaScript对象 XmlHttpRequest。该对象在Internet Explorer 5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。
在创建Web站点时,在客户端执行屏幕更新为用户提供了很大的灵活性。下面是使用Ajax可以完成的功能:
* 动态更新购物车的物品总数,无需用户单击Update并等待服务器重新发送整个页面。
* 提升站点的性能,这是通过减少从服务器下载的数据量而实现的。例如,在Amazon的购物车页面,当更新篮子中的一项物品的数量时,会重新载入整个页面,这必须下载32K的数据。如果使用Ajax计算新的总量,服务器只会返回新的总量值,因此所需的带宽仅为原来的百分之一。
* 消除了每次用户输入时的页面刷新。例如,在Ajax中,如果用户在分页列表上单击Next,则服务器数据只刷新列表而不是整个页面。
* 直接编辑表格数据,而不是要求用户导航到新的页面来编辑数据。对于Ajax,当用户单击Edit时,可以将静态表格刷新为内容可编辑的表格。用户单击Done之后,就可以发出一个Ajax请求来更新服务器,并刷新表格,使其包含静态、只读的数据。
一切皆有可能!但愿它能够激发您开始开发自己的基于Ajax的站点。然而,在开始之前,让我们介绍一个现有的Web站点,它遵循传统的提交/等待/重新显示的范例,我们还将讨论Ajax如何提升用户体验。 (更多…)
标签Tags:
ajax,
html,
ie,
javascript,
JavaScript&Ajax,
status,
url,
web,
xml,
xmlhttp,
代码,
兼容,
函数,
分页,
容器,
对象,
属性,
常用,
应用程序,
引入,
数据,
方法,
更新,
浏览器,
程序,
系统,
网络编程,
节点,
表格,
诫,
说明,
连接,
页面
JavaScript&Ajax, 网络编程
2010年07月26日
by 江小邪
0 comments
用法:
<div id=”test”>
<span style=”color:red”>test1</span> test2
</div>
在JS中可以使用:
test.innerHTML:
也就是从对象的起始位置到终止位置的全部内容,包括Html标签。
上例中的test.innerHTML的值也就是“<span style=”color:red”>test1</span> test2 ”。
test.innerText:
从起始位置到终止位置的内容, 但它去除Html标签
上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。
test.outerHTML:
除了包含innerHTML的全部内容外, 还包含对象标签本身。
上例中的text.outerHTML的值也就是<div id=”test”><span style=”color:red”>test1</span> test2</div>
完整示例:
<div id=”test”>
<span style=”color:red”>test1</span> test2
</div>
<a href=”javascript:alert(test.innerHTML)”>innerHTML内容</a>
<a href=”javascript:alert(test.innerText)”>inerHTML内容</a>
<a href=”javascript:alert(test.outerHTML)”>outerHTML内容</a>
特别说明:
innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用innerHTML,而少用innerText,如果要输出不含HTML标签的内容,可以使用innerHTML取得包含HTML标签的内容后,再用正则表达式去除HTML标签,下面是一个简单的符合W3C标准的示例:
<a href=”javascript:alert(document.getElementById(‘test’).innerHTML.replace(/<.+?>/gim,”))”>无HTML,符合W3C标准</a>
标签Tags:
div,
html,
ie,
javascript,
JavaScript&Ajax,
js,
对象,
属性,
正则表达式,
浏览器,
网络编程,
诫,
说明
JavaScript&Ajax, 网络编程
2010年07月26日
by 江小邪
0 comments
Ajax技术的实现主要依赖于xmlhttprequest,但我们在调用其来进行异步数据的传输时,由于xmlhttp是个短线过程(处理事件完成后就销毁)如果不对该对象进行包装处理的话,就不得不在需要调用的地方重新构建xmlhttprequest,每次调用都要写一大段的代码,实在不是个好办法。好在现在很多开源的ajax框架都提供了对xmlhttp封装的方案。这里以ajaxtags自带的prototype-1.4.0.js为母版,来看看如何将xmlhttp对象封装成一个可复用的方法。
在prototype.js中,首先定义了一个变量:Ajax
var Ajax = {
getTransport: function() {
return Try.these(
function() {return new ActiveXObject(‘Msxml2.XMLHTTP’)},
function() {return new ActiveXObject(‘Microsoft.XMLHTTP’)},
function() {return new XMLHttpRequest()}
) || false;
},
activeRequestCount: 0
}
变量返回了一个xmlhttprequest,可以看到,如果我们调用了Ajax.getTransport(),每次都会返回一个新的xmlhttprequest对象。
(更多…)
标签Tags:
ajax,
code,
div,
html,
JavaScript&Ajax,
js,
url,
xml,
xmlhttp,
中文,
人,
代码,
初始值,
区别,
对象,
属性,
数据,
方法,
网络编程,
获取,
表单,
诫,
错误,
页面
JavaScript&Ajax, 网络编程
2010年07月26日
by 江小邪
0 comments
下面是我对一部分缺陷的看法:
为Ajax而Ajax(Using Ajax for the sake of Ajax.)
很同意这点,当一个技术本身的生存意义由于它自身的亮点而被抹杀,不知道是这个技术的幸运还是不幸。
干掉了back按钮(Breaking the back button)
back按钮是一个标准的web站点UI的重要功能。然后,后退按钮没法和js很好的合作……
gmail似乎作的很好?不过没去仔细看过gmail如何实现后退和js相容的,被这个mistake一提醒,也许这也是ue的一个切口哦。
点击的时候没有提供一个可视化的提示(Not giving immediate visual cues for clicking widgets)
……也许是我没看懂,觉得写这段的人自相矛盾。。他说没提供可视化提示,不过是拿gmail右上角的红色提示作为例子。 (更多…)
标签Tags:
ajax,
code,
google,
html,
ie,
javascript,
js,
PHP,
web,
人,
代码,
兼容,
可用性,
应用程序,
收藏,
数据,
方法,
浏览器,
版本,
程序,
系统,
网络编程,
自身,
解决,
诫,
链接,
错误,
页面
PHP, 网络编程
2010年07月26日
by 江小邪
0 comments
一、 引言
毫无疑问,AJAX已经成为当今Web开发中一种强有力的用户交互技术,但是它的许多可能性应用仍然鲜为人知。在本文中,我们将来共同探讨如何使用JavaScript对象标志(JSON)和JSON分析器在服务器和客户端AJAX引擎之间创建复杂而强有力的JSON数据传输层。我们将详细讨论如何创建一组对象(在其它语言中经常被当作一个包),如何把这些对象串行化为JSON以发送到服务器端,以及如何把服务器端JSON反串行化为客户端JavaScript对象。
提示:你可以在Douglas Crockford的网站上找到本文中使用的JSON分析器。
在继续阅读前,本文假定你已经掌握了JavaScript技术并且了解如何创建一个基本的AJAX引擎,并经由AJAX技术向服务器端发出请求和从服务器端接收响应。为了更好地理解本文中示例,你需要下载本文相应的源码文件。 (更多…)
标签Tags:
ajax,
div,
html,
javascript,
js,
mod,
PHP,
url,
web,
xml,
人,
代码,
分离,
对象,
属性,
应用程序,
数据,
数据库,
方法,
浏览器,
程序,
类,
网站,
网络编程,
自身,
诫,
链接,
面向对象
PHP, 网络编程
2010年07月26日
by 江小邪
0 comments
在指南的开始,我们说过数据过滤在任何语言、任何平台上都是WEB应用安全的基石。这包含检验输入到应用的数据以及从应用输出的数据,而一个好的软件设计可以帮助开发人员做到:
确保数据过滤无法被绕过,确保不合法的信息不会影响合法的信息,并且识别数据的来源。
关于如何确保数据过滤无法被绕过有各种各样的观点,而其中的两种观点比其他更加通用并可提供更高级别的保障。
(更多…)
标签Tags:
html,
include,
mod,
PHP,
PHP,
PHP安全,
url,
web,
人,
代码,
判断,
数据,
方法,
程序,
类,
网络编程,
表单,
设计,
诫,
软件,
邮件,
重定向,
错误,
验证
PHP, 网络编程
2010年07月26日
by 江小邪
0 comments
1.- DRY: Don’t repeat yourself.
DRY 是一个最简单的法则,也是最容易被理解的。但它也可能是最难被应用的(因为要做到这样,我们需要在泛型设计上做相当的努力,这并不是一件容易的事)。它意味着,当我们在两个或多个地方的时候发现一些相似的代码的时候,我们需要把他们的共性抽象出来形一个唯一的新方法,并且改变现有的地方的代码让他们以一些合适的参数调用这个新的方法。
DRY 这一法则可能是编程届中最通用的法则了,目前为止,应该没有哪个程序员对这一法则存有异议。但是,我们却能发现,一些程序在编写单元测试(unit testing)时忘记了这一法则:让我们相像一下,当你改变一个类的若干接口,如果你没有使用DRY,那么,那些通过调用一系例类的接口的unit test的程序,都需要被手动的更改。比如:如果你的unit test的诸多test cases中没有使用一个标准共有的构造类的方法,而是每个test case自己去构造类的实例,那么,当类的构造函数被改变时,你需要修改多少个test cases啊。这就是不使用DRY法则所带来的恶果。 (更多…)
标签Tags:
PHP,
编程,
网络编程,
诫
PHP, 网络编程
2010年07月22日
by 江小邪
0 comments
在做网站过程中,常常要修改网站模板,而模板受css控制。如果在用CSS设计布局时遇到BUG,请认真阅读以下内容,非常容易记忆的,不知道哪位高人把CSS BUG编成了*****了!看看好不好记住呢?
一、IE边框若显若无,须注意,定是高度设置已忘记;
二、浮动产生有缘故,若要父层包含住,紧跟浮动要清除,容器自然显其中;
三、三像素文本慢移不必慌,高度设置帮你忙;
四、兼容各个浏览须注意,默认设置行高可能是*****;
五、独立清除浮动须铭记,行高设无,高设零,设计效果兼浏览;
六、学布局须思路,路随布局原理自然直,轻松驾驭html,流水布局少hack,代码清爽,兼容好,友好引擎喜欢迎。
七、所有标签皆有源,只是默认各不同,span是无极,无极生两仪—内联和块级,img较特殊,但也遵法理,其他只是改造各不同,一个*号全归原,层叠样式理须多练习,万物皆规律。
八、图片链接排版须小心,图片链接文字链接若对齐,padding和vertical-align:middle要设定,虽差微细倒无妨。
九、IE浮动双边距,请用display:inline拘。
十、列表横向排版,列表代码须紧靠,空隙自消须铭记。
标签Tags:
css,
html,
ie,
人,
代码,
兼容,
图片,
容器,
模板,
网站,
设计,
诫,
邪人邪语,
链接
邪人邪语