Posted on 2007-11-08 17:12
G_G 阅读(482)
评论(1) 编辑 收藏 所属分类:
javascript Framework
参考:
http://visualjquery.com/1.1.2.html
1.定位
$( 'xx' )
$("p[a]").hide();
$("p:eq(0)").show();
$("div:visible").hide();
$("ul/li")
/* valid too: $("ul > li") */
$("p.foo[a]");
$("input[@name=bar]").val();
$("input[@type=radio][@checked]")
2.事件添加
<a href="#" name="li" >Link</a>
$(document).ready(function() {
$("a").click(function() {
$("div").hide(); //跌代不可见 <a>
});
});
3.页面 javascript 输入(和jsp的 out.print(...))$(html)
$("<div id='div1'><font color='red''>Hello</font></div>").appendTo("body");
4.写css
$(document.body).css( "background", "black" );
5.包含定位
<p>one</p> <div><p>two</p></div> <div>three</div>
$("div > p") //定位two <p>two</p>
6.范围定位
<body>
<form>
<input type="button" value="哈哈"/>
</form>
</body>
$("input:button", document.forms[0])[0].setAttribute("value","google");
或 $("div", xml.responseXML) 等
7.表达试定位$("p[@name='p1']").hide();//hide不要 $(..)[0]
$("input[@name='butt1']:button", document.forms[0])[0].setAttribute("value","google");
8.$(..).fun.. 添加方法
<form>
<input name="butt1" type="button" value="google"/>
</form>
<script>
jQuery.fn.extend({
check: function() {
alert('check');
}
});
$("input[@name='butt1']:button", document.forms[0]).check();
</script>
或
jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});
9.$.noConflict()
<body>
<form>
<input name="butt1" type="button" value="google"/>
</form>
<a href="#" temp_href="#" name="li" >Link</a>
<script>
var $j = jQuery.noConflict();
// Use jQuery via $j()
$j(document).ready(function(){
$("a").click(function() {
$j(document.forms[0]).hide();
});
});
</script>
</body>
10. $ 一般方法
//each(fn)$("img").each(function(i){
this.src = "test" + i + ".jpg";
});
<img/><img/>
<img src="test0.jpg"/><img src="test1.jpg"/>
$("p").eq(1) //后1个
$("p").lt(1) //正取 1 开始
$("img").get();//全取
$("img").get(0); //顺序取 0开始
$("p").gt(0) //反取从0开始
$("*").index( $('#foo')[0] )
<div id="foobar"><b></b><span id="foo"></span></div>
返回结果 2
$("img").length; //总长度
$("img").size();