1. 程式人生 > >選中頁面上所有選中的checkbox(使用原生js)

選中頁面上所有選中的checkbox(使用原生js)

前端面試題小結,使用原生js選擇頁面上所有選中的checkbox。

使用document.getElementsByTagName(‘input’)只能選中所有的input元素,還需要判斷是不是checkbox,是checkbox的話是否選中。實現程式碼如下

HTML程式碼:

<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3" checked>
<input type="checkbox" value
="4">
<input type="checkbox" value="5" checked> <input type="txtxarea" value="6"> <input type="checkbox" value="7"> <input type="submit" value="8">

JavaScript程式碼:

var arr = document.getElementsByTagName("input");
for(let i=0;i<arr.length;i++){
    if(arr[i].getAttribute('type'
)=='checkbox'&&arr[i].hasAttribute('checked')){ arr [i].style.float = "right"; } }

相關推薦

選中頁面所有選中checkbox使用原生js

前端面試題小結,使用原生js選擇頁面上所有選中的checkbox。 使用document.getElementsByTagName(‘input’)只能選中所有的input元素,還需要判斷是不是checkbox,是checkbox的話是否選中。實現程式碼如下

頁面某個節點的拖曳原生js和vue專案

HTML5中的draggable draggable 屬性規定元素是否可拖動(連結和影象預設是可拖動的。) /// true:規定元素是可拖動的,false:規定元素是不可拖動的,auto:使用瀏覽器的預設特性。 <element draggable="true|false|a

移動端滑動條原生JS

顏色 empty || 原生 pre border relative innerhtml 課程 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"

jsonp跨域寫淘寶搜索聯想詞原生js

div 註意 abs scrip 基礎 屬性 體驗 blur ext 一、主體 1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset=

地址的三級聯動原生js

html: <select name="provlevel" id="provlevel" style="width: 120px;height:30px;"> <option>--請選擇省份--</option></select><select

簡單的選項卡製作原生JS

<!doctype html> <html> <head> <meta charset="utf-8"> <title>無標題文件</title> <style> div{ width: 100p

原生JS 圖片無縫滾動、圖片轉化、輪播圖、摺疊效果

1.圖片無縫滾動(原生JS)<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>無縫滾動</title&g

ASP.NET Repeater實現全選反選原生JS

ASPX: <input id="checkAll" name="checkAll" type="checkbox" checked="checked" onclick="ToggleChe

將ajax請求封裝為一個物件原生js

var AjaxUtil = { // 預設基礎選項 options : { method : "get", //預設提交的方法 url : "", //請求的路徑 required params : {}, //請求的引數 type : 'text',

頁面動態載入內容checkbox選中取消事件

動態載入checkbox之後,選中,取消事件, //動態載入的checkbox內容 var dataObj = $.parseJSON(datas).CGYY;//datas為查找

原生js獲取到頁面所有的checkbox

har NPU doctype ble script 原生js ati -c wid <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> &l

用JavaScript獲取頁面選中的文字的技巧

這裡介紹的一個小技巧是如何用JavaScript獲取頁面上被選中的文字的方法。最關鍵的JavaScript API是: event.selection = window.getSelection(); 這裡的selection實際上是個物件,但如果我們使用 .toStr

.NET抓取數據範例 抓取頁面所有的鏈接

object lar url www box 時間 amr 發布 .org 原文發布時間為:2009-11-15 —— 來源於本人的百度文章 [由搬家工具導入].NET抓取数据范例 

使用JavaScript實現在頁面所有內容加載完之前一直顯示loading...頁面

back pro webkit index tro ear keyframes nload radius Html 1 <body class="is-loading"> 2 <div class="curtain"> 3 <

遍歷頁面所有TextBox控制元件並給它賦值為string.Empty

Using System.Windows.Forms; foreach(Control  control  in  this.Controls) {  //as運算子是把一個型別轉換為另一型別如果不成功返回null    is運算子是

JSP頁面顯示XML資訊庫裡讀出

一句話搞定: <pre name="code" class="java"><c:out value="XML_String" escapeXml="true"/> 這樣寫會把庫裡的xml資訊原樣講習讀出。如果直接用普通的輸出會導致一些內容不顯示。

來,讓我們寫一個網路爬蟲,下載頁面所有的照片吧!

什麼是網路爬蟲? 網路爬蟲是一種非常有意思的程式。偌大的Internet,就像是一隻蜘蛛織成的大網:一個個超級連結就是蛛絲,將無數頁面連線起來,而網路爬蟲,則會沿著一根根蛛絲,爬遍每一個節點…… 網路爬蟲能幹嘛? 蜘蛛在網上爬來爬去,當然不是為了健身。它會在網上尋覓獵

探究 | 如何捕獲一個Activity頁面所有的點選行為

## 前言 最近逛`wanAndroid`論壇,發現一個有趣的問題:**如何捕獲一個Activity頁面上所有的點選行為**。 一起研究下吧,不想看原始碼的小夥伴可以直接看文末總結~ ## 準備工作 先得羅列出頁面上的一些點選行為,常用的有: * 普通View的點選 * 動態add的View的點選 *

Java非遞歸的方式獲取目錄中所有文件包括目錄

class cto div 所有 new dir rem efi log 零、思路解析 對於給出的文件查看其下面的所有目錄,將這個目錄下的所有目錄放入待遍歷的目錄集合中,每次取出該集合中的目錄遍歷,如果是目錄再次放入該目錄中進行遍歷。 一、代碼 /**

Maven下載私服的jar包全局

code span repo mave bsp pro clas spa release <mirror> <id>maven-public</id> <mirrorOf>maven-public<