paramètres jQuery

Définition du contenu - text(), html() et val()

Nous utiliserons les trois mêmes méthodes du chapitre précédent pour définir le contenu :

text() - Définit ou renvoie le contenu du texte de l'élément sélectionné html() - Définit ou renvoie le contenu de l'élément sélectionné (y compris les balises HTML) val() - Définit ou renvoie la valeur du champ du formulaire

Ci-dessous L'exemple montre comment définir le contenu via les méthodes text(), html() et val()

Les fonctions de rappel de text(), html() et val()

Les trois méthodes jQuery ci-dessus : text(), html() et val() ont également des fonctions de rappel. La fonction de rappel prend deux paramètres : l'index de l'élément actuel dans la liste des éléments sélectionnés et la valeur d'origine (ancienne). Renvoyez ensuite la chaîne que vous souhaitez utiliser comme nouvelle valeur de la fonction.

Définir les attributs - attr()

La méthode jQuery attr() est également utilisée pour définir/modifier les valeurs d'attribut. La méthode

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#php").attr("href","http://www.php.cn/jquery");
  });
});
</script>
</head>
<body>
<p><a href="http://www.php.cn" id="php">php中文网</a></p>
<button>修改 href 值</button>
<p>点击按钮修改后，可以点击链接查看链接地址是否变化。</p>
</body>
</html>

attr() vous permet également de définir plusieurs attributs en même temps

fonction de rappel attr()

La méthode jQuery attr() fournit également une fonction de rappel. La fonction de rappel prend deux paramètres : l'index de l'élément actuel dans la liste des éléments sélectionnés et la valeur d'origine (ancienne). Renvoyez ensuite la chaîne que vous souhaitez utiliser comme nouvelle valeur de la fonction.

Formation continue

nouveau fichier

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1").click(function(){ $("#test1").text(function(i,origText){ return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")"; }); }); $("#btn2").click(function(){ $("#test2").html(function(i,origText){ return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")"; }); }); }); </script> </head> <body> <p id="test1">这是一个有 <b>粗体</b> 字的段落。</p> <p id="test2">这是另外一个有 <b>粗体</b> 字的段落。</p> <button id="btn1">显示新/旧文本</button> <button id="btn2">显示新/旧 HTML</button> </body> </html>

soumettre Réinitialiser le code

Opération automatique

paramètres jQuery

ÉlémentaireTutoriel de site Web d'imitation d'entreprise Imperial CMS

ÉlémentaireLes débutants sans aucune base dans WordPress créent des blogs personnels et des sites Web d'entreprise

ÉlémentaireVidéo d'instructions sur la création de sites Web à base zéro Ultimate CMS

ÉlémentaireProjet front-end-Shangyou [Pratique complète de la technologie HTML/CSS/JS]

IntermédiaireVue3.0 de 0 pour créer une pratique de projet de système de gestion backend universel

ÉlémentaireCours frontal base zéro [Vue apprentissage avancé et application pratique]

ÉlémentaireTutoriel WEB front-end [HTML5+CSS3+JS]

ÉlémentaireIntroduction rapide à apipost

IntermédiaireTutoriel pratique Vue3+TypeScript au niveau de l'entreprise

ÉlémentaireParlons brièvement de la création d'une entreprise en PHP

IntermédiaireProjet de commerce électronique VUE (combat réel de projet double front-end et back-end)

ÉlémentaireApplication pratique Apipost [api, interface, tests automatisés, mock]