Archive for the ‘PHP’ category

JavaScript回调函数无法同步

February 10th, 2012

自由度的部落閣 A little funny site……

此问题表现最明显莫过于在Ajax异步步处理时,总是无法将返回值传给全局变量。
自己测试了无数不同结构的方法,都无结果。目前应急,把与返回值有关操作全放到了回调函数里!
算是暂时性解决了问题,但实乃下下之举!不一定每个地方都能用。
将继续探索更完美的解决办法。

分享到开开   分享到新浪微博

CSS代码简洁化

February 8th, 2012

自由度的部落閣 A little funny site……

原则:
1. 使用Reset但并非全局Reset
不同浏览器元素的默认属性有所不同,使用Reset可重置浏览器元素的一些默认属性,以达到浏览器的兼容。但需要注意的是,请不要使用全局Reset:
*{ margin:0; padding:0; }
这不仅仅因为它是缓慢和低效率的方法,而且还会导致一些不必要的元素也重置了外边距和内边距。在此建议参考YUI Reset和Eric Meyer的做法。
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p,
blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td, /* table elements 表格元素 */
img/* img elements 图片元素 */{
border:medium none;
margin: 0;
padding: 0;
}
/** 设置默认字体 **/
body,button, input, select , textarea {
font: 12px/1.5 ‘宋体’,tahoma, Srial, helvetica, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; }
em{font-style:normal;}
/** 重置列表元素 **/
ul, ol { list-style: none; }
/** 重置超链接元素 **/
a { text-decoration: none; color:#333;}
a:hover { text-decoration: underline; color:#F40; }
/** 重置图片元素 **/
img{ border:0px;}
/** 重置表格元素 **/
table { border-collapse: collapse; border-spacing: 0; }
2. 良好的命名习惯
无疑乱七八糟或者无语义命名的代码,谁看了都会抓狂。就像这样的代码:
.aaabb{margin:2px;color:red;}
我想即使是初学者,也不至于会在实际项目中如此命名一个cl as s,但有没有想过这样的代码同样是很有问题的:

My name is Wiky

问题在于如果你需要把所有原本红色的字体改成蓝色,那修改后就样式就会变成:
.red{color:bule;}
这样的命名就会很让人费解,同样的命名为.leftBar的侧边栏如果需要修改成右侧边栏也会很麻烦。所以,请不要使用元素的特性(颜色,位置,大小等)来命名一个class或id,您可以选择意义的命名如:#navigation{…},.sidebar{…},. post wrap{…}
这样,无论你如何修改定义这些class或id的样式,都不影响它跟 HTML 元素间的联系。
另外还有一种情况,一些固定的样式,定义后就不会修改的了,那你命名时就不用担忧刚刚说的那种情况,如
.alignleft{float:left;margin-right:20px;}
.alignright{float:right;text-align:right;margin-left:20px;}
.clear{clear:both;text-indent:-9999px;}
那么对于这样一个段落

我是一个段落!

如果需要把这个段落由原先的左对齐修改为右对齐,那么只需要修改它的className就为alignright就可以了。
3. 代码缩写
CSS代码缩写可以提高你写代码的速度,精简你的代码量。在CSS里面有不少可以缩写的属性,包括margin,padding,border,font,background和颜色值等,如果您学会了代码缩写,原本这样的代码:
li{
font-family:Arial, Helvetica, sans-serif;
font-size: 1.2em;
line-height: 1.4em;
padding-top:5px;
padding-bottom:10px;
padding-left:5px;
}
就可以缩写为:
li{
font: 1.2em/1.4em Arial, Helvetica, sans-serif;
padding:5px 0 10px 5px;
}
4. 利用CSS继承
如果页面中父元素的多个子元素使用相同的样式,那最好把他们相同的样式定义在其父元素上,让它们继承这些CSS样式。这样你可以很好的维护你的代码,并且还可以减少代码量。那么本来这样的代码:
#container li{ font-family:Georgia, serif; }
#container p{ font-family:Georgia, serif; }
#container h1{font-family:Georgia, serif; }
就可以简写成:
#container{ font-family:Georgia, serif; }
5. 使用多重 选择器
你可以合并多个CSS选择器为一个,如果他们有共同的样式的话。这样做不但代码简洁且可为你节省时间和空间。如:
h1{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; }
h2{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; }
h3{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; }
可以合并为:
h1, h2, h3{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; }
6. 适当的代码注释
代码注释可以让别人更容易读懂你的代码,且合理的组织代码注释,可使得结构更加清晰。你可以选择做的 样式表 的开始添加目录:
/*————————————
1. Reset
2. Header
3. Content
4. SideBar
5. Footer
———————————– */
如此你代码的结构就一目了然,你可以容易的查找和修改代码。
而对于代码的主内容,也应适当的加以划分,甚至在有必要的地方在对代码加以注释说明,这样也有利于团队 开发 :
/*** Header ***/
#header{ height:145px; position:relative; }
#header h1{ width:324px; margin:45px 0 0 20px; float:left; height:72px;}
/*** Content ***/
#content{ background:#fff; width:650px; float:left; min-height:600px; overflow:hidden;}
#content h1{color:#F00}/* 设置字体颜色 */
#content .posts{ overflow:hidden; }
#content .recent{ margin-bottom:20px; border-bottom:1px solid #f3f3f3; position:relative; overflow:hidden; }
/*** Footer ***/
#footer{ clear:both; padding:50px 5px 0; overflow:hidden;}
#footer h4{ color:#b99d7f; font-family:Arial, Helvetica, sans-serif; font-size:1.1em; }
7. 给你的CSS代码排序
如果代码中的属性都能按照字母排序,那查找修改的时候就能更加快速:
/*** 样式属性按字母排序 ***/
div{
background-color:#3399cc;
color:#666;
font:1.2em/1.4em Arial, Helvetica, sans-serif;
height:300px;
margin:10px 5px;
padding:5px 0 10px 5px;
width:30%;
z-index:10;
}
8. 保持CSS的可读性
书写可读的CSS将会使得更容易查找和修改样式。对于以下两种情况,哪种可读性更高,我想不言而明。
/*** 每个样式属性写一行 ***/
div{
background-color:#3399cc;
color:#666;
font: 1.2em/1.4em Arial, Helvetica, sans-serif;
height:300px;
margin:10px 5px;
padding:5px 0 10px 5px;
width:30%;
z-index:10;
}
/*** 所有的样式属性写在同一行 ***/
div{ background-color:#3399cc; color:#666; font: 1.2em/1.4em Arial, Helvetica, sans-serif; height:300px; margin:10px 5px; padding:5px 0 10px 5px; width:30%; z-index:10; }
当对于一些样式属性较少的选择器,我会写到一行:
/*** 选择器属性少的写在同一行 ***/
div{ background-color:#3399cc; color:#666;}
对于这个规则并非硬性规定,但无论您采用哪种写法,我的建议是始终保持代码一致。属性多的分行写,属性少于3个可以写一行。
9. 选择更优的样式属性值
CSS中有些属性采用不同的属性值,虽然达到的效果差不多,当性能上却存在着差异,如
区别在于border:0把border设为0px,虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值。
而border:none把border设为”none”即没有,浏览器解析”none”时将不作出渲染动作,即不会消耗内存值。所以建议使用border:none;
同样的,display:none隐藏对象浏览器不作渲染,不占用内存。而visibility:hidden则会。
10. 使用 代替@import
首先,@import不属于 XHTML 标签,也不是 Web 标准的一部分,它对于较早期的浏览器兼容也不高,并且对于网站的性能有某些负面的影响。
11. 使用外部样式表
这个原则始终是一个很好的 设计 实践。不单可以更易于维护修改,更重要的是使用外部文件可以提高页面速度,因为CSS文件都能在浏览器中产生 缓存 。内置在HTML文档中的CSS则会在每次请求中随HTML文档重新 下载 。所以,在实际应用中,没有必要把CSS代码内置在HTML文档中:

而是使用 导入外部样式表: 12. 避免使用CSS表达式(Expre ssi on)
CSS表达式是动态设置CSS属性的强大(但危险)方法。Internet Explorer从第5个版本开始支持CSS表达式。下面的例子中,使用CSS表达式可以实现隔一个小时切换一次背景颜色:
background-color: expression( (new Date()). get Hours()%2 ? “#B8D4FF” : “#F08A00″ );
如上所示,expression中使用了JavaScr ip t表达式。CSS属性根据 JavaScript 表达式的计算结果来设置。
表达式的问题就在于它的计算频率要比我们想象的多。不仅仅是在页面显示和缩放时,就是在页面滚动、乃至移动鼠标时都会要重新计算一次。给CSS表达式增加一个计数器可以跟踪表达式的计算频率。在页面中随便移动鼠标都可以轻松达到10000次以上的计算量。
如果必须使用CSS表达式,一定要记住它们要计算成千上万次并且可能会对你页面的性能产生影响。所以,在非不得已,请避免使用CSS表达式。
13. 代码压缩
当你决定把网站项目部署到网络上,那你就要考虑对CSS进行压缩,出去注释和空格,以使得 网页 加载得更快。压缩您的代码,可以采用一些工具,如YUI Compressor,利用它可精简CSS代码,减少文件大小,以获得更高的加载速度。

分享到开开   分享到新浪微博

CSS一句话显示圆角

February 8th, 2012

自由度的部落閣 A little funny site……

是CSS3的新特性

.div{
border-radius: 5px 5px 5px 5px;
}

四个值分别对应:左上,右上,左下,右下 四个角

具体操作看链接,非常详细:

http://www.w3cplus.com/content/css3%E7%9A%84%E5%9C%86%E8%A7%92border-radius

分享到开开   分享到新浪微博

MySQL添加列,修改列,删除列

February 6th, 2012

自由度的部落閣 A little funny site……

来源:http://blog.csdn.net/ws84643557/article/details/6939846


ALTER TABLE:添加,修改,删除表的列,约束等表的定义。
*. 查看列:desc 表名;
*. 修改表名:alter table t_book rename to bbb;
*. 添加列:alter table 表名 add column 列名 varchar(30);
*. 删除列:alter table 表名 drop column 列名;
*. 修改列名MySQL: alter table bbb change nnnnn hh int;
*. 修改列名SQLServer:exec sp_rename’t_student.name’,'nn’,'column’;
*. 修改列名Oracle:lter table bbb rename column nnnnn to hh int;
*. 修改列属性:alter table t_book modify name varchar(22);
sp_rename:SQLServer 内置的存储过程,用与修改表的定义。
MySQL 查看约束,添加约束,删除约束 添加列,修改列,删除列
*. 查看表的字段信息:desc 表名;
*. 查看表的所有信息:show create table 表名;
*. 添加主键约束:alter table 表名 add constraint 主键 (形如:PK_表名) primary key 表名(主键字段);
*. 添加外键约束:alter table 从表 add constraint 外键(形如:FK_从表_主表) foreign key 从表(外键字段) references 主表(主键字段);
*. 删除主键约束:alter table 表名 drop primary key;
*. 删除外键约束:alter table 表名 drop foreign key 外键(区分大小写);
*. 修改表名:alter table t_book rename to bbb;
*. 添加列:alter table 表名 add column 列名 varchar(30);
*. 删除列:alter table 表名 drop column 列名;
*. 修改列名MySQL: alter table bbb change nnnnn hh int;
*. 修改列名SQLServer:exec sp_rename’t_student.name’,'nn’,'column’;
*. 修改列名Oracle:alter table bbb rename column nnnnn to hh int;
*. 修改列属性:alter table t_book modify name varchar(22);
sp_rename:SQLServer 内置的存储过程,用与修改表的定义。

分享到开开   分享到新浪微博

JavaScript中窗口的各种宽和高

February 5th, 2012

自由度的部落閣 A little funny site……

截取自:http://wapapp.baidu.com/wapshare/detail/24697973?ssid=0&from=2001a&uid=bd_1327666890_664&pu=usm@0,sz@480_360&bd_page_type=1


网页可见区域宽:document.body.clientWidth
网页可见区域高:document.body.clientHeight
网页可见区域宽:document.body.offsetWidth (包括边线的宽)
网页可见区域高:document.body.offsetHeight (包括边线的宽)
网页正文全文宽:document.body.scrollWidth
网页正文全文高:document.body.scrollHeight
网页被卷去的高:document.body.scrollTop
网页被卷去的左:document.body.scrollLeft
网页正文部分上:window.screenTop
网页正文部分左:window.screenLeft
屏幕分辨率的高:window.screen.height
屏幕分辨率的宽:window.screen.width
屏幕可用工作区高度:window.screen.availHeight
屏幕可用工作区宽度:window.screen.availWidth
HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth
scrollHeight: 获取对象的滚动高度。
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollWidth:获取对象的滚动宽度
offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
event.clientX 相对文档的水平座标
event.clientY 相对文档的垂直座标
event.offsetX 相对容器的水平坐标
event.offsetY 相对容器的垂直坐标
document.documentElement.scrollTop 垂直方向滚动的值
event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量
IE,FireFox 差异如下:
IE6.0、FF1.06+:
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = height + padding + border
IE5.0/5.5:
clientWidth = width – border
clientHeight = height – border
offsetWidth = width
offsetHeight = height
(需要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)

分享到开开   分享到新浪微博

DIV的两种隐藏

February 4th, 2012

自由度的部落閣 A little funny site……

One:
隐藏后页面显示空白
style=”visibility: none;”
style.visibility=”hidden”;//隐藏
style.visibility=”visible”;//显示


Two:
隐藏后释放占用的页面空间
style=”display: none;”
style.display=”none”;//隐藏
style.display=”block”;//显示

分享到开开   分享到新浪微博

JavaScript节点操作总结

February 2nd, 2012

自由度的部落閣 A little funny site……

来源:http://blog.csdn.net/xwhself/article/details/6091333
DOMDocument还真不是一般的强大哦!
用到了js操作节点,就一起查找了一下,作个总结,还能当字典使。
区分大小写的哈~
属性:(绝大部分都是只读的)
1 Attributes 存储节点的属性列表(只读)
2 childNodes 存储节点的子节点列表(只读)
3 dataType 返回此节点的数据类型
4 Definition 以DTD或XML模式给出的节点的定义(只读)
5 Doctype 指定文档类型节点(只读)
6 documentElement 返回文档的根元素(可读写)
7 firstChild 返回当前节点的第一个子节点(只读)
8 Implementation 返回XMLDOMImplementation对象
9 lastChild 返回当前节点最后一个子节点(只读)
10 nextSibling 返回当前节点的下一个兄弟节点(只读)
11 nodeName 返回节点的名字(只读)
12 nodeType 返回节点的类型(只读)
13 nodeTypedValue 存储节点值(可读写)
14 nodeValue 返回节点的文本(可读写)
15 ownerDocument 返回包含此节点的根文档(只读)
16 parentNode 返回父节点(只读)
17 Parsed 返回此节点及其子节点是否已经被解析(只读)
18 Prefix 返回名称空间前缀(只读)
19 preserveWhiteSpace 指定是否保留空白(可读写)
20 previousSibling 返回此节点的前一个兄弟节点(只读)
21 Text 返回此节点及其后代的文本内容(可读写)
22 url 返回最近载入的XML文档的URL(只读)
23 Xml 返回节点及其后代的XML表示(只读)
方法:
1 appendChild 为当前节点添加一个新的子节点,放在最后的子节点后
2 cloneNode 返回当前节点的拷贝
3 createAttribute 创建新的属性
4 createCDATASection 创建包括给定数据的CDATA段
5 createComment 创建一个注释节点
6 createDocumentFragment 创建DocumentFragment对象
7 createElement 创建一个元素节点
8 createEntityReference 创建EntityReference对象
9 createNode 创建给定类型,名字和命名空间的节点
10 createPorcessingInstruction 创建操作指令节点
11 createTextNode 创建包括给定数据的文本节点
12 getElementsByTagName 返回指定名字的元素集合
13 hasChildNodes 返回当前节点是否有子节点
14 insertBefore 在指定节点前插入子节点
15 Load 导入指定位置的XML文档
16 loadXML 导入指定字符串的XML文档
17 removeChild 从子结点列表中删除指定的子节点
18 replaceChild 从子节点列表中替换指定的子节点
19 Save 把XML文件存到指定节点
20 selectNodes 对节点进行指定的匹配,并返回匹配节点列表
21 selectSingleNode 对节点进行指定的匹配,并返回第一个匹配节点
22 transformNode 使用指定的样式表对节点及其后代进行转换
23 transformNodeToObject 使用指定的样式表将节点及其后代转换为对象
节点的绝对引用:
返回文档的根节点
document.documentElement
返回当前文档中被击活的标签节点
document.activeElement
返回鼠标移出的源节点
event.fromElement
返回鼠标移入的源节点
event.toElement
返回激活事件的源节点
event.srcElement
节点的相对引用:(设当前对节点为node)
返回父节点
node.parentNode
node.parentElement
返回子节点集合(包含文本节点及标签节点)
node.childNodes
返回子标签节点集合
node.children
返回子文本节点集合
node.textNodes
返回第一个子节点
node.firstChild
返回最后一个子节点
node.lastChild
返回同属下一个节点
node.nextSibling
返回同属上一个节点
node.previousSibling

分享到开开   分享到新浪微博

去除MySql复合查询时产生的重复结果

December 3rd, 2011

自由度的部落閣 A little funny site……

1.问题描述
当前要执行搜索,单一对文章标题或内容搜索一般不会产生重复(前提是你的数据库本身无重复数据)。当执行全局搜索时,就会产生重复结果。


2.实例
假定当前要对文章标题和内容同时执行搜索,如下:

1
SELECT * FROM article WHERE title LIKE "%PHP%" OR content LIKE "%PHP%"


那么,如果某条结果中文章标题和内容同时含有PHP关键字,就会被重复放到结果集中。


3.解决
运用DISTINC关键字就能简单解决,改上面语句如下:

1
SELECT DISTINC * FROM article WHERE title LIKE "%PHP%" OR content LIKE "%PHP%"

分享到开开   分享到新浪微博

PHP单引号插入错误的简单解决

November 23rd, 2011

自由度的部落閣 A little funny site……

PHP向MySql提交数据时,如果含有单引号,则必然报错!

下面有简单的解决办法,对于没有开启magic_quotes_gpc也适用。

先判断是否开起了magic_quotes_gpc,未开启则对数据中的敏感词转义。

1
2
3
if(!get_magic_quotes_gpc()){
 $_POST['message'] = addslashes($_POST['message']);
}else{}

分享到开开   分享到新浪微博

有点乱了«kerblog»自用博客程序开发中

November 21st, 2011

自由度的部落閣 A little funny site……

自学了段时间PHP,也跟着边学就边写一个自己的博客程序了。是一个类似Wordpress的超轻量级级博客程序。目前自用。如果能完善到可公开的程度(现在还不成型呢),会放到Google的开源分享上去,供各位PHPer修改使用。
其实很早就想写自己的博客程序了,Wordpress虽然是一个非常优秀的东西,但太过臃肿,又千篇一律,实在不适合自己。而自己学PHP的原因也很多,当然主要为了混口饭吃,就把写这个博客当作自己的初学练习了,写自己喜欢的东西,兴趣会大些。
程序刚开始时几乎全是单个文件实现功能,一大片一大片的代码全在一个文件里。比如admin.php,增删改查(查正准备写)全在里面,代码甚是壮观!
以前其实在课程里学过Java,本来很喜欢的,不知道中间被啥事耽搁了,就一直扔下了。这里说Java,其实就是想引着说下PHP的面向对象。当时学Java,映像最深的就是面向对象了,现在拿起来还是很轻松的。话说用面向对象写东西确实非常方便,非常省代码。而且让整个程序更加条理清晰。
比起程序代码,CSS代码其实是最让人头疼的。自己的CSS也是现学现用,程序里不管三七二十一,用到CSS就往代码里加,虽然每个页面文件有自己独立的CSS文件对应,但现在打开CSS文件看,还是一篇头大,那叫乱啊!自我感觉,无用重复代码很多。现在是没有时间优化了,等程序最后模块化吧。
相比刚开始写这个程序时的那种冲劲,现在真的有些无力,主要是由于太乱了,写完一个功能就不知道下面该写啥了。。。还是开始实施前,规划不够细。然后现在一想到还有好多杂七杂八的东西要写就无所适从了。因为是抽课余时间写,现在进度缓慢中。可能要求有点过高了,写着写着就感觉自己的代码很乱,变量名五花八门,好多时间都会搞混。唉!一定要有一套自己的命名规则!
现在乱,可能还有一个原因就是没有用到模板,没有学呢,这个也打算在程序最后分出来,目前感觉他将是一个工作量很大的工程!
接下来干什么呢?除了外观,现在博客的几大必须部件都有了。。。恩。。。接着写个文章编辑器那样的东西吧,要么发布文章都要用html,而且不安全。。。注册验证,评论验证也要写。。。恩。。。还有。。。
是不是要重新做个博客构架的更详细的图呢?也许那样就不乱了。。。
努力思考中。。。

分享到开开   分享到新浪微博

© 2010-2012 KermitLau 网站备案编号: 天朝ICP备00000001 -- Copyright notice by Blog Copyright