你不了解的querySelector

2021-08-21 10:36:21 字數 1459 閱讀 6748

概述返回當前文件中匹配乙個特定選擇器的所有的元素(使用深度優先,前序遍歷規則這樣的規則遍歷所有文件節點) .返回的物件型別是 nodelist.

elementlist = document.queryselectorall(selectors);
下面的例子返回乙個文件中所有的class為"note"或者 "alert"的div元素.

var matches = document.queryselectorall("div.note, div.alert");

id="outside">

id="my-id">

id="inside">

class="lonely">

div>

class="outer">

class="inner">

div>

div>

div>

body>

html>

document.queryselector("#my-id").queryselectorall("img")

document.queryselectorall("#my-id div div");

document.queryselector("#my-id").queryselectorall("div div");

document.queryselectorall("#my-id div div").length === 1;

document.queryselector("#my-id").queryselectorall("div div").length === 3;

這是因為,element.queryselectorall不是從element開始匹配元素的。而事實上,它會在element的子代元素中匹配查詢條件。因此,我們找到了三個div元素: div.lonely,div.outer,div.inner。我們找它們是因為它們都匹配div div選擇符,而且它們都是#my-id的子代元素。

我們要記住,queryselector/queryselectorall下的css選擇器是絕對的。它們並不會相對於任何特定的元素,甚至不會相對於呼叫queryselectorall的元素。

這甚至對呼叫queryselectorall的元素的外部元素生效。例如,這個選擇器:

document.queryselector("#my-id").queryselector("div div div")

id="my-id">

class="inner">

div>

div>

div>

body>

html>

49 你並不了解的format decimal

a 1.1 b 3.2 c a b print c 4.300000000000001 format可以格式化數字,第乙個引數是數字,第二個引數是想要格式化的數字格式 print format c,0.2f 4.30 print format c,e 4.300000e 00 print forma...

10件你不了解PHP的事情

php是我用過的語言中,最令人惱火的但同時也是最有趣的語言。我之所以說 令人惱火 主要是因為函式命名極其不一致。儘管我每天都要用到這些函式,我還是要想一下 究竟是str pos還是strpos?是str split還是strsplit?另一方面,有時候可以用一行簡單的 就能解決乙個難題。下面是一些很...

你還不了解的OKRs E是什麼?

2020年,okr目標管理法成為80 企業都開始關注的企業管理方法。一方面因為環境原因,跨地域辦公這種工作模式開始被考慮如何更好的去執行,另一方面okr本身能夠從員工的層面來改變整個企業,因為企業的根本還是大部分普通員工。okr是目標與關鍵成果,這是很多人都已經知道的部分,但能讓okr具體到實際執行...