jQuery

jQuery 的作用是简化 JavaScript 对 HTML DOM 的操作。是一款主流的浏览器的 JavaScript 库封装了JavaScript 相关方法的使用。

使用 JavaScript 定位 DOM 对象的常用方法

• 1、通过 ID 属性：document.getElementById() ("#id") 2、通过 class 属性：document.getElementByName() (".class") 3、通过标签名：document.getElementByTagName() $(标签名)

jQuery 的第一个例子

<-- 指定jQuery的库文件位置 -->
<script type="text/javascript" src="项目下的 相对/绝对 路径"></script>
<script type="text/javascript">
    /*
        1、$(document)，是 jQuery 中函数的名称，document 是函数的参数，作用是 document 对象变成 jQuery 函数库可以使用的对象
        2、ready：是 jQuery 中的函数，是“准备”的意思，当前页面的 DOM 对象加载成功后会执行 ready 函数的内容。ready 相当于 onLoad 事件
        3、function() 自定义的表示 onLoad 要执行的功能
    */
    $(document).ready(function(){
        //自定义的代码
        alert("Hello jQuery")
    })
    
    //【简写方式】
    $( function()
        {
            //函数内容
            alert("Hello jQuery 快捷方式")
        }
    )
</script>

DOM 对象和 jQuery 对象

DOM 对象

使用 JavaScript 语法创建的对象叫 DOM 对象，也就是 js 对象

var obj = getElementById("txt1")
obj 就是 DOM 对象，也叫做 js 对象

jQuery 对象

使用 jQuery 语法表示的对象叫做 jQuery 对象。 注意： jQuery 表示的对象都是数组

var jQobj = $("#txt1")
jQobj 就是使用 jQuery 语法表示的对象，也就是一个 jQuery 对象，他是一个数组

DOM 对象和 jQuery 对象存在相互转换

DOM 对象转 jQuery 对象：$(DOM对象)

jQuery 对象转 DOM 对象： var obj = ("#txt1")[0] 或者 var obj = ("#txt1").get(0) 或者 var obj = jQobj[0] 或者 var obj = jQobj.get(0) 从数组中获取第一个对象，第一个对象就是 DOM 对象。使用 [0] 或者 get(0)，0就是第一个对象的下标 补充1：通常建议，jQuery 对象命名时，最好以美元符号“$”开头，方便区分 例如：var$obj = $("#txt1") 补充2：之所以是[0] 或者 .get(0)，是因为，这是以 id 属性来获取的，而 id 值是独一无二的，所以数组中只有一个属性，所以是[0]

jQ选择器

选择器其实有7大类，但先学两个常用的大类：基本选择器和表单选择器

选择器是一个字符串，是用来定位 DOM 对象的，定位了 DOM 对象，就可以通过 jQuery 的函数操作 DOM

1、基本选择器

1.1、id 选择器

1.2、class 选择器

class 表示 css 中的样式，使用样式的名称来定位 DOM 对象 ​ 比如存在一个标签

$(":type属性值")
例如：
$(":text")：选取所有的单行文本框
$(":password")：选取所有的密码框
​
/*===============================================================================*/
​
提示1：表单选择器是包含 form 里的属性，比如包含 input、menus、textarea、label、legend 等
并且包含属性里的子属性，比如 input 里的 password
提示2：无论是否存在表单<form>，均可做出相应的选择
提示3：$(":tr")  不能用，因为 tr 不是input标签
补充：具体能获取什么元素，详细的元素，还没研究。但 input 的 type 的所有的值是没问题的。form 除了 input 属性还有别的属性，别的属性还没研究
<input>是<form>的一个元素。type 是<input> 的一个属性，text、password 是 type 的一个值

//方法一：将 $obj 对象遍历，转化成 DOM 对象
for(var i=0; i<$obj.length; i++){
    var dom = $obj[i]
    dom.value
}
​
//方法二：直接取值
$($obj[0]).val()
（或）$($obj.get(0)).val()
此方法需要 jQuery 对象中的 val()函数。所以要先转化回 jQuery 对象
var $obj = $(":checkbox")
for(var i=0; i<$obj.length; i++){
    alert($($obj[i]).val())
}
​
//方法三：通过 name
获取单选框元素第二个元素的value值
$(function () { 
   alert($(':radio[name=sex]').eq(1).val());   //女
});