JavaScript offsetParent属性

学过CSS的朋友都知道,当一个节点使用绝对定位后,那么他的定位参考系就是离他最近的且使用了绝对或相对定位的直系祖先节点。当没有这样的节点的时候,那么定位参考系为BODY节点。

这句话好像比较绕口,那就举个例子。比如A节点使用绝对定位,left:50px;top:40px;如果他的直系祖先节点中有使用了相对或绝对定位的节点P。那么,此时A节点的位置是相对P左上顶点向右偏移50px,向下偏移40px。如果没有这样的节点,那么A的位置就是相对BODY节点进行定位。
这里的offsetParent就类似这样的效果,这个属性会返回离调用对象最近的进行过CSS定位的直系祖先节点。如果没有这样的节点,会返回BODY节点。

DocumentFragment 对象的妙用

在了解这个对象之前,在向DOM追加多个节点时,我都会先创建一个空标签,然后把节点追加到一个空标签里,最后在把这个标签追加到DOM里。这样虽然避免了循环追加,多次渲染这样不友好的操作,但是这样却破坏了原有的文档结构。每次看到那个没用的空标签,都总觉得心里很不舒服,纠结着。

直到有一天看到《JavaScript高级编程》上说到有一种节点,将其插入文档树时,插入的不是其自身,而是它的所有子孙节点。这个神奇的节点就DocumentFragment,翻译过来应该叫文档片段。这样一来,困扰我已久的问题,终于迎刃而解了。想想兴奋之余,上手试一试先。

CSS较常用却又不容易记忆的一些属性

经常在做一些鼠标拖动处理的时候,经常会不知不觉把文字选中,接着拖动选中的文字,会触发有些浏览器的搜索命令。所以,在会被拖动区域的文字,应该设置成无法选中,这样就不会触发浏览器的搜索命令了。CSS3有属性已经支持这个功能了
user-select有两个值:
none:用户不能选择文本
text:用户可以选择文本
需要注意的是:user-select并不是一个W3C的CSS标准属性,浏览器支持的不完整,需要对每种浏览器进行调整

body{
-moz-user-select: none; /*火狐*/
-webkit-user-select: none;  /*webkit浏览器*/
-ms-user-select: none;   /*IE10*/
-khtml-user-select: none; /*早期浏览器*/
user-select: none;
}

表单数据传递测试(Asp.Net Mvc)

<div>        
    <form method="get" action="/Home/GetIndexArg">
    <input name="tg" type="text" value="1" />
    <input name="tg" type="text" value="2" />
    <input name="tg2" type="text" value="3" />
    <input type="submit" value="提交" />
    </form>
</div>

点完提交之后,页面传递参数是 /Home/GetIndexArg?tg=1&tg=2&tg2=3 会将Name相同的两个元素的值分别用 & 连接,而不是上次我认为的自动用 , 分隔
很久以前,刚刚接触ASP.NET MVC的时候,学习笔记