jQuery的ID选择器

86 阅读 0 评论 57 点赞

我是靠谱客的博主开朗柜子，最近开发中收集的这篇文章主要介绍jQuery的ID选择器，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

基本选择器在实际应用中比较广泛，建议重点掌握jQuery的基本选择器，它是其他类型选择器的基础，基础选择器是jQuery选择器中最为重要的部分。

jQuery基本选择器包括ID选择器、元素选择器、类名选择器、多种匹配条件选择器和通配符选择器。本篇介绍ID选择器。

一 ID选择器（#id）

ID选择器#id顾名思义就是利用DOM元素的id属性值来筛选匹配的元素，并以jQuery包装集的形式返回给对象。

这就像一个学校中每个学生都有自己的学号一样，学生的姓名是可以重复的但是学号却是不可以的，根据学生的学号就可以获取指定学生的信息。

ID选择器的使用方法如下：

$("#id");

其中，id为要查询元素的ID属性值。

例如，要查询ID属性值为user的元素，可以使用下面的jQuery代码：

$("#user");

如果页面中出现了两个相同的id属性值，程序运行时页面会报出JS运行错误的对话框，所以在页面中设置id属性值时要确保该属性值在页面中是唯一的。

二应用

在页面中添加一个ID属性值为testInput的文本输入框和一个按钮，通过单击按钮来获取在文本输入框中输入的值。

三代码

<script language="javascript" src="JS/jquery-3.1.1.min.js"></script>
<input type="text" id="testInput" name="test" value=""/>
<input type="button" value="输入的值为"/>
<script type="text/javascript">
$(document).ready(
function()
{
$("input[type='button']").click(
function()	//为按钮绑定单击事件
{
var inputValue = $("#testInput").val();
//获取文本输入框的值
alert(inputValue);
}
);
}
);
</script>

四运行效果