mrfangzheng

Hope and fear are useless. Be confident, and always be prepared for the worst.
posts - 314, comments - 149, trackbacks - 0, articles - 0
   :: 首页 :: 新随笔 :: 联系 ::  :: 管理

置顶随笔

[置顶]常用

锻炼体魄, 调整心态, 严守纪律, 忍耐痛苦, 坚持习惯

 

英语:

编程:

项目:

交易:

市场:

posted @ 2009-08-11 14:11 mrfangzheng 阅读(47) 评论(0) 编辑

2011年11月28日

设计的几个总结

  1. 名词化 : 名词容易管理
    1. 分类, 列表, 编辑
    2. 添加, 删除; 可用, 禁止
    3. 开始, 停止, 继续
    4. 复制, 粘帖, 发送
    5. 查看状态
    6. Undo, 回滚
  2. 范围 Scope
    1. 哪些在范围内, 哪些在范围外
  3. 共享/私用
  4. 数据空间
  5. 性能: IO, 集合(大量元素)
    1. 如何同步集合?

posted @ 2011-11-28 17:49 mrfangzheng 阅读(12) 评论(0) 编辑

任何成功不能只靠自己一个人

一个人再怎么聪明和努力, 也赶不上一群人.

所以, 能够成功的人都善于团结一群人, 说服他们向着一个目标, 并激发他们的想象力, 创造力, 热情和干劲.

 

posted @ 2011-11-28 15:15 mrfangzheng 阅读(10) 评论(0) 编辑

不要追求完美, 要能够忍受不是致命的错误

不要追求完美, 要能够忍受不是致命的错误

  1. 人类自身以及人类社会都是不完美的. 任何人都会说错话, 做错事; 人性有贪婪, 懒惰等阴暗的因素; 任何社会也都会有犯罪, 阴暗面.
  2. 关键看 正面 和 负面 的加权比(数学期望), 不是简单的概率比.
  3. 然而要特别注意那些概率小 但是非常致命的事件

 

posted @ 2011-11-28 15:07 mrfangzheng 阅读(16) 评论(0) 编辑

2011年11月5日

jQuery selectors

jQuery Selectors and Attribute Selectors
Selector Example Description
List accurate as of jQuery 1.3
* $(‘*’); This selector is a wild card method and will select all elements in a document.
#id $(‘#id’); This selector selects an element with the given ID.
.class $(‘.class’) The class selector will gather all elements in the document with the given class name
element $(‘element’) This selector will collect all elements in a document with the given tag name i.e. table, ul, li, a etc.
a, b, c. … n $(‘th, td, .class, #id’) This method can use multiple selection patterns to collect elements.
parent child $(‘li a’) This will select all “a” elements that are a descendant of “li”
a > b $(‘table > tr’); This will select all b elements which are a child element of a or in our example all tr elements in a table or tables.
a + b $(‘li + a’); This will select all “a” elements that are an immediate descendant of “li” in our example.
a ~ b $(‘p ~ ul’); This selector will select all “ul” elements that are a sibling of “p”
:first $(‘ul li:first’); Returns the first element in a result set
:first-child $(‘ul li:first-child’); Returns the first child element of the parent element.
:last $(‘ul li:last’); Returns the last element in a result set
:last-child $(‘ul li:last-child’); Returns the last child element of the parent element.
:o nly-child $(‘div p:only-child’); Returns elements which are the only child of the parent element.
:not(a) $(‘input:not(:checked)’); Returns all elements that are not “a” on in our example all input elements that are not checked
:has(a) $(‘div:has(p)’); Returns all elements with a descendant that matches a in out example a “div” that contains a “p”.
:o dd $(‘ul li:odd’); Returns all odd elements in a result set (zero based)
:even $(‘ul li:even’); Returns all even elements in a result set (zero based)
:eq(n) $(‘ul li:eq(n)’); Returns a numbered element identified by n (zero based)
:gt(n) $(‘ul li:gt(n)’); Returns all elements in a result set greater than n (zero based)
:lt(n) $(‘ul li:lt(n)’); Returns all elements in a result set less than n (zero based)
:nth-child(n) $(‘ul li:nth-child(n)’); Returns the nth child in a result set (one based)
:nth-child(odd) $(‘ul li:nth-child(odd)’); Returns all odd numbered elements in a result set (one based)
:nth-child(even) $(‘ul li:nth-child(even)’); Returns all even numbered elements in a result set (one based)
:nth-child(formula) $(‘ul li:nth-child(3n)’); Returns every nth child in a result set. In our example every third child (one based)
:header $(‘:header’); Returns all heading elements e.g. h1, h2, etc.
:animated $(‘ul:animated’); Returns elements with an animation currently in progress
:contains(text) $(‘:contains(hello)’); Returns all elements containing the passed string
:empty $(‘:empty’); Returns all elements that contain no child nodes
:parent $(‘li:parent’); Returns all elements that a parent nodes to any other DOM element including text nodes.
:hidden $(‘ul:hidden’); Returns all hidden elements that are hidden with CSS or input fields of the type “hidden”
:visible $(‘ul:visible’); Returns all visible elements
[attribute] $(‘[href]‘); Returns all elements that contain the passed attribute in our example any element with a “href” attribute
[attribute=value] $(‘[rel=external]‘); Returns all elements that the passed attribute value is equal to the passed value. In our example ant element with a “rel” attribute equal to “external”
['attribute!=value'] $(‘[rel!=external]‘); Returns all elements that the passed attribute value is not equal to the passed value. In our example ant element with a “rel” attribute that is not equal to “external”
[attribute!=value] $(‘[class^=open]‘); Returns all elements that the passed attribute value start with the passed value. In our example any element thats “class” attribute value begins with “open”
[attribute$=value] $(‘[id$=-wrapper]‘); Returns all elements that the passed attribute value ends with the passed value. In our example any element whos “id” ends with “-wrapper”
[attribute*=value] $(‘[class*=offer]‘); Returns all elements that the passed attribute value contains the passed value. In our example any element whos “class” contains the string “offer”
:input $(‘:input’); Returns only input elements of the tag name input, select, textarea and button
:text $(‘:text’); Returns only input elements of the type “text”
:password $(‘:password’); Returns only input elements of the type “password”
:radio $(‘:radio’); Returns only input elements of the type “radio”
:checkbox $(‘:checkbox’); Returns only input elements of the type “checkbox”
:submit $(‘:submit’); Returns only input elements of the type “submit”
:image $(‘:image’); Returns only input elements of the type “image”
:reset $(‘:reset’); Returns only input elements of the type “reset”
:file $(‘:file’); Returns only input elements of the type “file”
:button $(‘:button’); Returns only input elements of the type “button”
:enabled $(‘:enabled’); Returns all enabled input elements
:selected $(‘:selected’); Returns the selected element in a select list.
:disabled $(‘:disabled’); Returns disabled input elements
:checked $(‘:checked’); Returns checked input elements of the type radio or checkbox.

posted @ 2011-11-05 20:42 mrfangzheng 阅读(20) 评论(0) 编辑

2011年9月23日

CSS position: 一张图搞定absolute和relative

  • 红色表示 absolute块
    • 父容器必须是relative, 否则这些块就以整个网页为参照物
    • 定位和比例都是以参照物(父容器)计算, 比如: 100%指的是父容器的尺寸
    • absolute的体积不计算到父容器中
  • 蓝色表示 relative块
    • 参照物为自身
    • 占位不变(如图: 蓝色div和随后的绿色div之间有空隙, 后者仍用前者定位之前的所占位置计算)
    • 体积计算到父容器中
  • 修正了一个IE6的bug (container要加上 'zoom:1;')

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Layout Example</title>
    <style>
        #divContainer
        {
            border: solid red 2px; color: Red;

            position: relative;            
            zoom: 1; /*IMPORTANT: IE6 bug fix: force to re-layout*/
        }
        #divA
        {
            width: 400px; height: 100px; background-color: LightGreen; color: Black;
        }
        #divB
        {
            width: 300px; background-color: blue; color: White;

            position: relative;
            left: -30px;
            top: -10px;
        }
        #divC
        {
            width: 200px; height: 100px; background-color: limegreen; color: White;
        }
        #divD
        {
            width: 200px; color: white; background-color: OrangeRed; padding: 10px;

            position: absolute;
            left: 100%;
            top: -10px;
        }
        #divE
        {
            width: 200px; background-color: Brown; color: White;

            position: absolute;
            right: 10px;
            bottom: 10px;
        }
        #divF
        {
            width: 200px; background-color: red; color: white;

            position: absolute;
            right: 100%;
            top: 250px;
        }
        #divG
        {
            width: 200px; height: 100px; background-color: green; color: White;
        }
    </style>
</head>
<body>
    Layout example:
    <div style="padding: 300px;">
        <div id="divContainer">
            container (position: relative to make the children's 'absolute' work)

            <div id="divA">content A without any position</div>

            <div id="divB">
                Content B with relative position. It moves to left and above (according to itself)
                but its space remains. The height is caculated by its parent.
                <ol>
                    <li>position: relative (to itself)</li>
                    <li>left: -30px</li>
                    <li>top: -10px</li>
                </ol>
            </div>

            <div id="divC">content C without any position</div>

            <div id="divD">
                <div style="margin: 10px; border: solid 1px white">
                    content D with Absolute position. It moves to left and above (according to its parent)
                    and its height won't be calcuated by its parent.
                    <ol>
                        <li>position: absolute</li>
                        <li>left: 100% (to its parent)</li>
                        <li>top: -10px (to its parent)</li>
                    </ol>
                </div>
            </div>

            <div id="divE">
                content E with Absolute position, to its parent's bottom right.
                <ol>
                    <li>position: absolute</li>
                    <li>right: 10px (to its parent)</li>
                    <li>bottom: 10px (to its parent)</li>
                </ol>
            </div>

            <div id="divF">
                content F with Absolute position. It moves to right and above (according to its
                parent) and its height won't be calcuated by its parent.
                <ol>
                    <li>position: absolute</li>
                    <li>right: 100% (to its parent)</li>
                    <li>top: 250px (to its parent)</li>
                </ol>
            </div>

            <div id="divG">content G without any position</div>
        </div>
    </div>
</body>
</html>

 

 

posted @ 2011-09-23 15:51 mrfangzheng 阅读(182) 评论(0) 编辑

2011年9月19日

ORM vs SQL

ORM SQL
开发速度 快 慢
运行性能 慢 快
方便修改
可维护性 高 低

ORM

最大的问题是复杂查询

 

2者同时使用?

简单地方用ORM

复杂地方用SQL

posted @ 2011-09-19 15:24 mrfangzheng 阅读(11) 评论(0) 编辑

2011年9月15日

Web项目的技术和要注意的问题

业务技术:

  1. 前端业务
    1. 用户
      1. 注册/激活/登录/注销
      2. 找回密码
      3. 用户选项
    2. 最近历史, 最近浏览过 ...
    3. 商务
      1. 推荐
      2. 购物车 
    4. 交互
      1. 留言, 评论
      2. 打分
      3. 论坛
    5. 导航
      1. MasterPage
      2. Tab
      3. Menu
      4. Tree (with checkbox)
    6. 站内搜索
    7. 文本
      1. 文本自动补全
      2. 富文本编辑 (安全性)
    8. Form/实体编辑器(创建,编辑,保存更新,删除)
      1. 输入验证(客户端) + AJAX服务端验证
      2. 验证码
      3. 重复提交
    9. 表格
      1. 直接编辑/更新/删除
      2. 翻页
      3. 排序
      4. 分组
      5. Master/Details
    10. 图表: 折线图,饼图 ...
    11. Calendar/日期选取
    12. 音乐/视频播放
    13. 上传下载
      1. 进度条
      2. 多个上传
    14. 地图
    15. 分享到...
    16. SEO
    17. 遮罩
    18. 图片
      1. 放大 
      2. 阴影
      3. 滤镜
    19. 用户体验
      1. 换肤
      2. 过渡动画
    20. 多语言
  2. 前端技术 
    1. JQuery
    2. CSS
    3. AJAX
    4. Flash
    5. Silverlight
    6. HTML5 
  3. 后端
    1. ASP.NET MVC 3
    2. WCF/WebService
    3. NHibernate/EntityFramework

问题:

  1. 前端
    1. 浏览器兼容
      1. DIV布局
      2. PNG半透明(IE6)
    2. 安全性 (JS)
  2. 后端
    1. 安全性(SQL注入)
    2. ORM or SQL?

设计:

  1. 映射
  2. 模型
    1. 数据结构描述
    2. 数据存取器
    3. 实际数据
  3. 流程
    1. 参数传递

 

posted @ 2011-09-15 09:24 mrfangzheng 阅读(27) 评论(0) 编辑

2011年9月5日

中土翻译大全

摘要: 都说Pearl harbour是“ 珍珠港”的意思，其实还有更中土的翻译： 蚌埠。都说Greenland是“格陵兰”的意思，其实还有更中土的翻译：青岛。都说Deep River是宇多田光的专辑，其实它还有另外一个神奇的名字叫＂深圳＂。都说Newfoundland是纽芬兰，其实有更北京的翻译：新发地。都说rock hometown是“摇滚之乡”的 意思，其实还有更中土的翻译：石家庄。都说New York是“纽约”的意思，其实还有更中土的翻译：新乡。都说RedRiverValley是“红河谷”的意思，其实还有更中土的翻译：丹江口。都说Table mountain 叫桌山，其实还有个更土的名字叫平顶阅读全文

posted @ 2011-09-05 09:04 mrfangzheng 阅读(30) 评论(0) 编辑

2011年9月1日

弱类型+单元测试

摘要: 前台UI和后台数据库之间传递参数, 用强类型好呢? 还是用弱类型好呢?强类型的好处:参数名称, 类型在代码中定义的很清楚, 前台和后台有一个成文的协议有IDE的帮助, 参数名字自动补全强类型的坏处:修改不方便, 至少要修改参数定义文件, 前台文件, 后台文件弱类型的好处和坏处和强类型正好相反,前台和后台之间的协议只是口头上的.不过, 可用单元测试来保证前台和后台遵守相同的参数协议阅读全文

posted @ 2011-09-01 13:21 mrfangzheng 阅读(4) 评论(0) 编辑

设计: 有状态对象和无状态对象

摘要: 无状态对象用于处理逻辑, 而不是持有数据把数据从一个有状态对象处理后传输到另一个有状态对象属性和字段都是临时的, 不共享, 无需持久化使用时随时创建, 随时丢弃有状态对象持用数据共享需要持久化保持内部数据一致版本, 身份, 值比较, HashCode数据访问: 遍历, 查找, 排序数据变化事件阅读全文

posted @ 2011-09-01 10:53 mrfangzheng 阅读(27) 评论(0) 编辑

仅列出标题  下一页