Combat réel HTML5 et analyse du sélecteur CSS - querySelector()

Aujourd'hui, je vais vous présenter les connaissances pertinentes de HTML5. Aujourd'hui, je présenterai principalement le nouveau sélecteur comme thème. Le sélecteur qui vous est présenté aujourd'hui est querySelector(). Je vais le partager avec vous en comparant les deux méthodes d'écriture de jQuery et JavaScript. J'espère que cela pourra être utile à tous ceux qui apprennent le HTML5.

La méthode querySelector() reçoit un sélecteur CSS et renvoie le premier élément qui correspond au modèle. Si aucun élément correspondant n'est trouvé, null est renvoyé. Un petit exemple est le suivant :

　1) Obtenir des balises

Code JavaScript

var body = document.querySelector('body');

	body.style.background = "red";

	alert(body)//[object HTMLpElement]

　 Code jQuery

var $body = $("body");

$body.css({
	'background': "red"
});

alert($body) //[object Object]

　Effet d'aperçu

　1. 🎜>

　

2.jQuery

　

2) Obtenir une pièce d'identité

　

Code HTML

<p id="box1" class="box">梦龙小站</p>
<section id="box2" class="box">梦龙小站</section>

Code JavaScript

var box1 = document.querySelector('#box1');

	box1.innerHTML = "这是box1";

	alert(box1)//[object HTMLpElement]

Code jQuery

var $box1 = $("#box1");

$box1.html("这是用jQuery实现的");

alert($box1)  //[object Object]

Effet d'aperçu

1.

2.jQuery

Lorsque la méthode querySelector() est appelée via le type de document, les éléments correspondants seront trouvés dans la plage des éléments du document. Lorsque la méthode querySelector() est appelée via le type d'élément, les éléments correspondants ne seront trouvés que dans la plage des éléments descendants de l'élément. Les sélecteurs CSS peuvent être simples ou complexes, selon la situation. Si un sélecteur non pris en charge est transmis, querySelector() signalera une erreur.

Ceci est l'introduction au combat réel HTML5 et à l'analyse du sélecteur CSS - querySelector(). Considérant que HTML5 demande plus d'expérience et contient beaucoup de choses, des points de connaissances spécifiques seront introduits un par un, donc chaque article ne sera pas forcément très long. J'espère que tout le monde pourra le comprendre. L'avantage de faire cela est de faciliter la recherche à l'avenir. Merci pour votre soutien et votre amour. Pour plus de contenu lié à HTML5, veuillez prêter attention aux mises à jour sur le combat réel et l'analyse de HTML5 de Menglong Station.

Ce qui précède est le contenu. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www.php.cn) !