来自 Styling Forms with Attribute Selectors - Part 2

表单元素具有3个特征：

The disabled form control does not receive focus 不能获得焦点

The disabled form control is skipped in tabbed navigation 不进入 tab 导航

The information the form control contains does not get sent 不提交值

下面是css代码片段及简单解释

input[type="text"]:disabled{

opacity: .7;

}

不透明度 70%

input[type="text"]:disabled:after {

content: “(disabled - do not use)”;

font-size: .9em;

color: #CCCCCC;

display: block;

}

后面加一句话 “(disabled - do not use)”

input[type="radio"]:checked{

background: #9F393F;

}

多项选择，选中状态背景为 #9F393F

来自 jQuery for JavaScript programmers，太简单的不记录，笔记如下：

$(”p[a]“)

得到所有包含链接的 p

</p> <p><script type="text/javascript" src="/temp/jQuery/jquery.js"></script></p> <p><script type="text/javascript"></p> <p>$(function(){</p> <p>$("p[a]“).css(”background-color”,”#69c”)</p> <p>})</p> <p></script></p> <p>这里有个链接<a href="#1">1111</a></p> <p>这个没有</p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

jQuery(’input[@name=email]‘)

拿到

注意：jQuery() 和 $() 是一回事。前者不容易冲突；后者短。

jQuery(’div#content a:visible’)

jQuery(’table.orders tr:odd’)

:visible 当前可见的元素（没有被hide）；

odd（偶数）或者even（奇数）这是 css2 的语法，拿到单（奇）数行

:visible 和 :hidden

jQuery 自定义的属性，拿到 显示｜隐藏 的元素。

</p> <p><script type="text/javascript" src="/temp/jQuery/jquery.js"></script></p> <p><script></p> <p> $(document).ready(function(){</p> <p> $("div:visible").click(function () {</p> <p> $(this).css("background", "yellow");</p> <p> });</p> <p> $("button").click(function () {</p> <p> $("div:hidden").show("fast");</p> <p> });</p> <p> });</p> <p> </script></p> <style> <p> div { width:50px; height:40px; margin:5px; border:3px outset green; float:left; }</p> <p> .starthidden { display:none; }</p> </style> <p><button>Show hidden to see they don’t change</button></p> <div></div> <div class="starthidden"></div> <div></div> <div></div> <div style="display:none;"></div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

jQuery bookmarklet

使用下面的 jQuery bookmarklet 可以在任意页面引用 jQuery.js，然后使用firebug 控制台（options - large command line）或者地址栏调试 javascript。

</p> <p><a class="bookmarklet" href="javascript:void(function(){var s=document.createElement('script');s.src='http://code.jquery.com/jquery-1.1.2.js';document.getElementsByTagName('head')[0].appendChild(s);}())">jQuery bookmarklet</a></p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

not()

反选。jquery 官方文档 只有 :not，没找到 not() 文档。

$(”input:not(:checked) + span”).css(”background-color”, “yellow”);

</p> <p><script type="text/javascript" src="/temp/jQuery/jquery.js"></script></p> <p><script></p> <p> $(document).ready(function(){</p> <p>jQuery('div').not('[@id]‘).css(”color”,”#c00″);</p> <p> });</p> <p> </script></p> <div>没有id属性的 div</div> <div id="a1">id = a1 的 div</div> <div id=""> <div>没有id属性的 div</div> </div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

Chaining

链式语法。大约就是

OEJECT.函数1(function(){…}).函数2(function(){…})

一口气写完，不用重复书写 OEJECT 了。

jQuery 源代码

比如

var div = jQuery(’

‘);

直接拿到那个 div。

DOM loaded

页面加载完毕。下面三种写法含义是一样的。

jQuery(document).ready(function() {</p> <p> alert(’The DOM is ready!’);</p> <p>});</p> <p>————————————————</p> <p>jQuery(function() {</p> <p> alert(’The DOM is ready!’);</p> <p>});</p> <p>————————————————</p> <p>$(function() {</p> <p> alert(’The DOM is ready!’);</p> <p>});

jQuery AJAX

load() 载入一个页面（不能跨域，否则报告权限错误）。据说还可以 DOM 选取以及 limit 限制字符，但我没有试验成功(2007-12-26 的 http://code.jquery.com/jquery-latest.js )。

In jQuery 1.2 you can now specify a jQuery selector in the URL. Doing so will filter the incoming HTML document, only injecting the elements that match the selector. The syntax looks something like “url #some > selector”.

</p> <p><script type="text/javascript" src="/temp/jQuery/jquery.js"></script></p> <p><script></p> <p> $(document).ready(function(){</p> <p>jQuery('div#intro').load('all.asp');</p> <p> });</p> <p> </script></p> <div id="intro">载入 guoshuang blog 所有日志标题,请稍等…</div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

更多 AJAX 函数

jQuery.ajax( options ) Returns: XMLHttpRequest

Load a remote page using an HTTP request.

load( url, data, callback ) Returns: jQuery

Load HTML from a remote file and inject it into the DOM.

jQuery.get( url, data, callback ) Returns: XMLHttpRequest

Load a remote page using an HTTP GET request.

jQuery.getJSON( url, data, callback ) Returns: XMLHttpRequest

Load JSON data using an HTTP GET request.

jQuery.getScript( url, callback ) Returns: XMLHttpRequest

Loads, and executes, a local JavaScript file using an HTTP GET request.

jQuery.post( url, data, callback ) Returns: XMLHttpRequest

相关资料：

jquery 官方文档

jQuery plugins

用 jQuery.noConflict() 声明一下。比如下面的

jQuery.noConflict();</p> <p>jQuery(”#content”).hide(); //使用 jQuery 选择器</p> <p>$(”content”).style.display = ‘none’; //继续使用其它框架的 $ 选择器

或者采用这样的写法

(function($) {</p> <p> // 这里面的 $ 属于 jquery</p> <p>})(jQuery);

guoshuang,zhanggy,pingbf 智商对比

<img src="http://chart.apis.google.com/chart?cht=p3&chd=t:60,30,10&chs=500x200&chl=guoshuang|zhanggy|pingbf&chco=cc0000,ff8811" /> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

更多 chart 相关日志

原文来自 Five Firefox Tips You May Not Know About

1.把要搜索的文字拖到地址栏，回车，这就是 google 的 lucky 搜索；

2.点击地址栏右侧向下箭头，选择一个浏览过的地址，按 delete 键删除这个记录。

3.ctrl+tab 在标签页中切换，ctrl+数字 切换到第（数字）个标签页；

4.把下载地址直接拖到 download 按钮上。（默认没有，在 customize 中拖到 toolbar 上即可）

5.view page info 的 media 中方便找到页面中的图片和多媒体等。

都是很旧的技巧，但估计很多人不知道。

更多 firefox 技巧 日志

看到这篇 XSL中的运算符与变量名，挺有趣的，XSL 还有这样的 bug？

这样 ItemCount-1 被当成一个变量名！（包括 - 号）如果写成

才是减的意思。