Maison >interface Web >js tutoriel >Explication détaillée des fonctions JavaScript de sélection de tout et d'inversion de la sélection (avec des exemples de code)

Explication détaillée des fonctions JavaScript de sélection de tout et d'inversion de la sélection (avec des exemples de code)

藏色散人
藏色散人avant
2022-08-06 13:48:022090parcourir

Cet article présente comment Native Js implémente les fonctions de sélection de tout et d'inversion de la sélection. J'espère qu'il sera utile aux amis dans le besoin !

Idée : Nous obtenons d'abord le nœud

		遍历每个节点 获取到checked的属性
		然后我们通过改变checked的属性改变选中的状态
		全选的时候我们让他们都为true 
		反选的时候我们使用!达到效果

Explication détaillée des fonctions JavaScript de sélection de tout et dinversion de la sélection (avec des exemples de code)

Les points de connaissance utilisés cette fois sont :

document.getElementsByName(‘name属性’):选中所有的name为name属性的的元素节点对象
document.getElementById('id名称'): 通过id名称获取一个元素节点对象
onclick:鼠标点击事件

partie html :

<input> 全选
<input>足球
<input>篮球
<input>羽毛球
<input>反选

js part

var items = document.getElementsByName('items');
var quan = document.getElementById('quan');
var fan = document.getElementById('fan');

function fan1(){
    var index = 0;
    for(var i =0;i<items.length quan.onclick="function(){" fan.onclick> <p><img src="https://img.php.cn/upload/article/000/000/020/a37a80b3c1cd10f0bf97587d1908c868-1.png" alt="Explication détaillée des fonctions JavaScript de sélection de tout et dinversion de la sélection (avec des exemples de code)"> </p>
<p>Recommandations associées :【<a href="https://www.php.cn/course/list/17.html" target="_blank">Tutoriel vidéo JavaScript</a>】</p>
<link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/markdown_views-22a2fefd3b.css" rel="stylesheet">
<link href="https://csdnimg.cn/release/blogv2/dist/mdeditor/css/style-4f8fbf9108.css" rel="stylesheet"></items.length>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer