Latest web development tutorials

jQuery sélecteur

Selector jQuery vous permet d'éléments HTML de groupe ou un seul élément à utiliser.


jQuery sélecteur

Selector jQuery vous permet d'éléments HTML de groupe ou un seul élément à utiliser.

jQuery sélecteur basés sur des éléments id, les classes, les types, les attributs, les valeurs d'attribut, et ainsi de suite "Rechercher" (ou sélectionner) les éléments HTML. Il est basé sur existantes sélecteurs CSS , en plus, il a aussi quelques sélecteurs personnalisés.

Tous les sélecteurs jQuery commencent par un signe dollar: $ ().


sélecteurs

sélecteurs jQuery sélectionner des éléments basés sur le nom de l'élément.

Sélectionnez tous les éléments <p> dans la page:

$("p")

Exemples

L'utilisateur clique sur le bouton, tous les éléments <p> sont cachés:

Exemples

$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});

Essayez »


sélecteur #id

jQuery #id sélecteurs sélectionnez éléments spécifiés par l'attribut id de l'élément HTML.

éléments id de la page doit être unique, de sorte que vous voulez sélectionner uniquement les éléments dans la page par sélecteur #id.

Id en sélectionnant les éléments de syntaxe suivants:

$("#test")

Exemples

Lorsque l'utilisateur clique sur le bouton, les éléments ont id = attribut "test" sera caché:

Exemples

$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});

Essayez »


.class sélecteur

sélecteur de classe jQuery peut trouver un élément de la classe spécifiée.

La syntaxe est la suivante:

$(".test")

Exemples

L'utilisateur clique sur le bouton après avoir tous les éléments avec class = "test" sont des attributs cachés:

Exemples

$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
});

Essayez »


D'autres exemples

语法 描述 实例
$("*") 选取所有元素 在线实例
$(this) 选取当前 HTML 元素 在线实例
$("p.intro") 选取 class 为 intro 的 <p> 元素 在线实例
$("p:first") 选取第一个 <p> 元素 在线实例
$("ul li:first") 选取第一个 <ul> 元素的第一个 <li> 元素 在线实例
$("ul li:first-child") 选取每个 <ul> 元素的第一个 <li> 元素 在线实例
$("[href]") 选取带有 href 属性的元素 在线实例
$("a[target='_blank']") 选取所有 target 属性值等于 "_blank" 的 <a> 元素 在线实例
$("a[target!='_blank']") 选取所有 target 属性值不等于 "_blank" 的 <a> 元素 在线实例
$(":button") 选取所有 type="button" 的 <input> 元素 和 <button> 元素 在线实例
$("tr:even") 选取偶数位置的 <tr> 元素 在线实例
$("tr:odd") 选取奇数位置的 <tr> 元素 在线实例

fichier séparé en utilisant la fonction jQuery

Si votre site contient de nombreuses pages, et vous voulez que votre fonction jQuery est facile à entretenir, donc s'il vous plaît mettez vos fonctions jQuery dans un fichier .js séparé.

Lorsque nous démontrons dans jQuery tutoriel, la fonction sera ajoutée directement à la section <head>. Cependant, les mettre dans un fichier séparé sera meilleur, comme celui-ci (fichier référencé par l'attribut src):

Exemples

<head>
<script src="http://cdn.static.w3big.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script src="my_jquery_functions.js"></script>
</head>