codecamp

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 »



W3.JS 选择器
W3.JS 添加样式
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }