Jquery总结
Jquery 基础概念总结
最好从http://www.w3school.com.cn/jquery/jquery_selectors.asp开始
1. $ 功能前缀
2. window.onload 事件
2.1$(document).ready (function(){//…});
//1文件加载时执行:
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script> //引入 jQuery.js文件
//2 document 是浏览器当前的对象 function(){}是jQuery的函数
<script type="text/javascript">
$(document).ready(function() {
alert('jquery');
});
</script>
2.2$(function(){//..});
3. 创建 Dom
$(function(){
var newp=$(“<p> 新元素 </p>”);
newp.insertAfter(“#myTager”);
});
4. 选择器
//非常有用的功能,能够节省大量的Javascript代码在查询Dom对象上。
4.1 属性选择
4.2 位置选择
4.3 元素选择器
4.3.1 元素基本选择
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取 id="demo" 的第一个 <p> 元素。
如:获取一个input textbox的value值,它的id=1
var temp=$("input#1").attr("value");
4.3.2元素复合条件选择
如:有两个相同的input textbox id属性同为1,class属性分别为"v1"和"v2",选择class="v2"的value值
var temp=$("input[id='1'][class='v2'] ").attr("value"); //( [][][]) 可以提供多个选项
5. 页面控制
5.1添加事件
如 : 有一个button控件,ID=5,Value="获取对象值";另有一个javascript function: alerts();
要为这个控件bind一个click 事件 alerts();
//1 页面初始化,执行
$(document).ready(function(){
//2 选择器选择,这个元素
$("input['id=5'][type='button']").bind("click",alerts); //3
bind
事件click
});
5.2解除事件
如 : 上面的按钮添加了click事件,可以用unbind方法,解除事件
$("input[id='5'][type='button']").unbind("click",alerts);
或
$("input[id='5'][type='button']").unbind("click"); // unbind了所有的click
$("input[id='5'][type='button']").unbind();
6. 属性
jQuery 1.2以后,添加了获取任意属性值 val()
如 :获取任意具有value元素的value值 ,包括select元素,如下
$("input[id='1']").val();
如 :设置某元素的value值
$("input[id='1']").val("Hello");