課程
/前端開發
/JavaScript
/JavaScript入門篇
只用一個按鍵顯示隱藏,怎么弄
2017-09-08
源自：JavaScript入門篇 3-5
正在回答
<p id="by" >sssssssssssssssssss</p>
<input id="btn" type="button" value="點擊隱藏" onclick="ove()">
<script>
function ove(){
var bb = document.getElementById('by');
if(bb.style.display !='none'){
bb.style.display='none';
btn.value="顯示內容";
}else{
bb.style.display='block';
btn.value="點擊隱藏";
}
</script>
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset="UTF-8">
<title>display</title>
? ? <script type="text/javascript">?
? ? ? ? var i=0;
? ? ? ? function modifytext()??
{??
? if(i%2==0)
? ? ? ? ? {
? ? ? ? ? ? con.style.display="none";
? ? ? ? ? ? btn.value="顯示內容";
? ? ? ? ? ? i++;
? ? ? ? ? }
? ? ? ? ? else
? ? ? ? ? ? con.style.display="block";
? ? ? ? ? ? btn.value="隱藏內容";
? ? </script>?
</head>?
<body>??
? ? <h1>JavaScript</h1>??
? ? <p id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>?
? ? <form>
? ? ? ?<input type="button" id="btn" onclick="modifytext()" value="隱藏內容" />?
? ? </form>
</body>?
</html>
<!DOCTYPE?HTML><html><head><meta?http-equiv="Content-Type"?content="text/html;?charset="UTF-8"><title>display</title>????<script?type="text/javascript">?????????var?i=0;????????function?modifytext()?? {?? ??if(i%2==0)??????????{????????????con.style.display="none";????????????btn.value="顯示內容";????????????i++;??????????}??????????else??????????{????????????con.style.display="block";????????????btn.value="隱藏內容";????????????i++;??????????} }????</script>?</head>?<body>??????<h1>JavaScript</h1>??????<p?id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>?????<form>???????<input?type="button"?id="btn"?onclick="modifytext()"?value="隱藏內容"?/>?????</form></body>?</html>
</head>
<body>
<p id="clear">刮風這天，我喜歡握著你手</p>
<form>
<input type="button" value="顯示/隱藏" onclick="modify()"/>
</form>
var s=1;
function modify()
{
if(s==1)
document.getElementById('clear').style.display = 'none';
s=2;
else if(s==2)
document.getElementById('clear').style.display='block';
s=1;
?
</body>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className屬性</title>
? ? <p id="p1" > JavaScript使網頁顯示動態效果并實現與用戶交互功能。</p>
????<input type="button" value="更改外觀" onclick="modify()"/>
<script type="text/javascript">
? function add(){
? ? ?var p1 = document.getElementById("p1");
? ? ? ?p1.style.display="none"
? }
? function modify(){
? ? ?var p2 = document.getElementById("p2");
? ? p2.style.display="block"
螞蟻六條腿
舉報
JavaScript做為一名Web工程師的必備技術，本教程讓您快速入門
3 回答假如只有一個按鈕 顯示時隱藏 隱藏時顯示 該怎么寫呢？
1 回答隱藏顯示按鈕不管用
2 回答我的顯示和隱藏按鈕怎么不起作用
2 回答隱藏和顯示
4 回答為什么按隱藏按鈕內容還是顯示？
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯系客服咨詢優惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2018-08-17
<p id="by" >sssssssssssssssssss</p>
<input id="btn" type="button" value="點擊隱藏" onclick="ove()">
<script>
function ove(){
var bb = document.getElementById('by');
if(bb.style.display !='none'){
bb.style.display='none';
btn.value="顯示內容";
}else{
bb.style.display='block';
btn.value="點擊隱藏";
}
}
</script>
2018-05-31
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset="UTF-8">
<title>display</title>
? ? <script type="text/javascript">?
? ? ? ? var i=0;
? ? ? ? function modifytext()??
{??
? if(i%2==0)
? ? ? ? ? {
? ? ? ? ? ? con.style.display="none";
? ? ? ? ? ? btn.value="顯示內容";
? ? ? ? ? ? i++;
? ? ? ? ? }
? ? ? ? ? else
? ? ? ? ? {
? ? ? ? ? ? con.style.display="block";
? ? ? ? ? ? btn.value="隱藏內容";
? ? ? ? ? ? i++;
? ? ? ? ? }
}
? ? </script>?
</head>?
<body>??
? ? <h1>JavaScript</h1>??
? ? <p id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>?
? ? <form>
? ? ? ?<input type="button" id="btn" onclick="modifytext()" value="隱藏內容" />?
? ? </form>
</body>?
</html>
2018-05-31
<!DOCTYPE?HTML><html><head><meta?http-equiv="Content-Type"?content="text/html;?charset="UTF-8"><title>display</title>????<script?type="text/javascript">?????????var?i=0;????????function?modifytext()?? {?? ??if(i%2==0)??????????{????????????con.style.display="none";????????????btn.value="顯示內容";????????????i++;??????????}??????????else??????????{????????????con.style.display="block";????????????btn.value="隱藏內容";????????????i++;??????????} }????</script>?</head>?<body>??????<h1>JavaScript</h1>??????<p?id="con">做為一個Web開發師來說，如果你想提供漂亮的網頁、令用戶滿意的上網體驗，JavaScript是必不可少的工具。</p>?????<form>???????<input?type="button"?id="btn"?onclick="modifytext()"?value="隱藏內容"?/>?????</form></body>?</html>2017-11-21
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<p id="clear">刮風這天，我喜歡握著你手</p>
<form>
<input type="button" value="顯示/隱藏" onclick="modify()"/>
</form>
<script>
var s=1;
function modify()
{
if(s==1)
{
document.getElementById('clear').style.display = 'none';
s=2;
}
else if(s==2)
{
document.getElementById('clear').style.display='block';
s=1;
}
}
?
</script>
</body>
</html>
2017-09-08
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className屬性</title>
</head>
<body>
? ? <p id="p1" > JavaScript使網頁顯示動態效果并實現與用戶交互功能。</p>
????<input type="button" value="更改外觀" onclick="modify()"/>
<script type="text/javascript">
? function add(){
? ? ?var p1 = document.getElementById("p1");
? ? ? ?p1.style.display="none"
? }
? function modify(){
? ? ?var p2 = document.getElementById("p2");
? ? p2.style.display="block"
? }
</script>
</body>
</html>