let all = document.querySelector('#checkAll') let cks = document.querySelectorAll('.ck') let span = document.querySelector('span') all.addEventListener('click',function(){ for(let i = 0;i<cks.length;i++) { cks[i].checked = all.checked } if(all.checked === true) { span.innerHTML = '取消' }else{ span.innerHTML = '全选' } }) for(let i = 0;i<cks.length;i++) { cks[i].addEventListener('click',function(){ for(let j = 0;j<cks.length;j++) { if(cks[j].checked === false) { all.checked = false span.innerHTML = '全选' return } } all.checked = true span.innerHTML = '取消' }) }这段代码采用外链式如何写
时间: 2024-01-31 13:01:45 浏览: 89
js中document.getElementByid、document.all和document.layers区分介绍
要将这段代码用外链式写,需要将它写在一个单独的 JavaScript 文件中,然后在 HTML 中引用这个文件。具体步骤如下:
1. 将这段代码复制到一个新建的文件中,比如命名为 `checkbox.js`。
2. 在 HTML 文件中添加一个 `<script>` 标签,用于引用这个文件。可以在文档的 `<head>` 中添加:
```html
<head>
<script src="checkbox.js"></script>
</head>
```
这里假设 `checkbox.js` 文件与 HTML 文件在同一目录下。
3. 删除原 HTML 文件中的这段代码,因为现在已经通过外链式引用了。
4. 在 HTML 中添加相应的 HTML 代码,包括一个全选的复选框、一组被全选/取消的复选框以及一个显示状态的 `<span>` 元素。具体代码可以参考原来的 HTML 代码。
阅读全文