W3.JS 隐藏和显示


w3.hide( selector)

使用元素 ID 隐藏元素

要隐藏具有指定 id 的元素,请在 id 名称前面使用井号标记 (#)。

隐藏 id="London" 的元素:

示例

<button onclick="w3.hide('#London')">Hide</button>

亲自试一试» 使用 CSS »


使用标签名称隐藏元素

要隐藏具有指定标签名称的所有元素,请使用标签名称(不带 < 和 >)作为选择器。

隐藏所有 <h2> 元素:

示例

<button onclick="w3.hide('h2')">Hide</button>

亲自试一试» 使用 CSS »


使用类名隐藏元素

要隐藏具有指定类名的所有元素,请在类名前面使用句点 (.)。

隐藏 class="city" 的元素:

示例

<button onclick="w3.hide('.city')">Hide</button>

亲自试一试» 使用 CSS »


使用元素 ID 显示元素

要显示具有指定 id 的元素,请在 id 名称前面使用井号标记 (#)。

显示 id="London" 的元素:

示例

<button onclick="w3.show('#London')">Show</button>

亲自试一试» 使用 CSS »


使用标签名称显示元素

要显示具有指定标签名称的所有元素,请使用标签名称(不带 < 和 >)作为选择器。

显示所有 <h2> 元素:

示例

<button onclick="w3.show('h2')">Show</button>

亲自试一试» 使用 CSS »


使用类名称显示元素

要显示具有指定类名的所有元素,请在类名前面使用句点 (.)。

显示 class="city" 的元素:

示例

<button onclick="w3.show('.city')">Show</button>

亲自试一试» 使用 CSS »

切换隐藏/显示

w3.toggleShow( selector)

使用元素 ID 切换隐藏和显示

在隐藏和显示 id="London" 的元素之间切换:

示例

<button onclick="w3.toggleShow('#London')">Toggle Hide/Show</button>

亲自试一试» 使用 CSS »


使用标签名称切换隐藏和显示

在隐藏和显示所有 <h2> 元素之间切换:

示例

<button onclick="w3.toggleShow('h2')">Toggle Hide/Show</button>

亲自试一试» 使用 CSS »


使用类名称切换隐藏和显示

使用 class="city" 在隐藏和显示元素之间切换:

示例

<button onclick="w3.toggleShow('.city')">Toggle Hide/Show</button>

亲自试一试» 使用 CSS »