                        課程
                    
                        /前端開發(fā)
                        
                            /JavaScript
                        
                        /JavaScript入門篇

爆炸，五個按鈕一個都沒用，關鍵還找不到問題在哪里？。？

<!DOCTYPE HTML>

<html>

<head>

<title>javascript</title>

body{font-size:12px;}

#txt{

? ? height:400px;

? ? width:600px;

border:#333 solid 1px;

padding:5px;}

p{

line-height:18px;

text-indent:2em;}

</style>

</head>

<body>

? <h2 id="con">JavaScript課程</h2>

? <div id="txt">?

? ? ?<h5>JavaScript為網(wǎng)頁添加動態(tài)效果并實現(xiàn)與用戶交互的功能。</h5>

? ? ? ? <p>1. JavaScript入門篇，讓不懂JS的你，快速了解JS。</p>

? ? ? ? <p>2. JavaScript進階篇，讓你掌握JS的基礎語法、函數(shù)、數(shù)組、事件、內(nèi)置對象、BOM瀏覽器、DOM操作。</p>

? ? ? ? <p>3. 學完以上兩門基礎課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。</p>

? </div>

??

? ?<form>

?

? ? <input type="button" value="改變顏色" onClick="changeColor()"> ?

? ? <input type="button" value="改變寬高" onClick="changeHeight()">

? ? <input type="button" value="隱藏內(nèi)容" onClick="hides()">

? ? <input type="button" value="顯示內(nèi)容" onClick="shows()">

? ? <input type="button" value="取消設置" onClick="cancel()">

? </form>

? <script type="text/javascript">

? ? ? ? var con=document.getElementById("con");

? ? ? ? var txt=document.getElementById("txt");

? ?function changeColor(){

? ? ? ? ? ?

? ? ? ? ? ? //con.style.color="#100000";

? ? ? ? ? ? //con.style.backgroundColor="#000000";

? ? ? ? ? ?// txt.style.color="red";;

? ? ? ? ? ? txt.style.backgroundColor="#000000";

? ? ? ? }

//定義"改變寬高"的函數(shù)

? ? function changeHeight(){

? ? ? ? ?

? ? ? ? ?//con.style.width="200px";

? ? ? ? ?//con.style.height="100px";

? ? ? ? ?txt.style.width="500px";

? ? ? ? ?txt.style.height="500px";

? ? }

//定義"隱藏內(nèi)容"的函數(shù)

? ? function hides(){

? ? ? ? ?

? ? ? ? ?//con.style.display="none";

? ? ? ? ?txt.style.display="none";

? ? }

//定義"顯示內(nèi)容"的函數(shù)

? ? function shows(){

? ? ? ? ?

? ? ? ? // con.style.display="block";

? ? ? ? ?txt.style.display="block";

? ? }

//定義"取消設置"的函數(shù)

? ? function cancel(){

? ? ? ? var tk=confirm("是否取消？")

? ? ? ? if(tk==ture) {

? ? ? ? ? ? tk.removeAttribute("style");

? ? ? ? }

? </script>

</body>

</html>

二十七杯酒3976242

2017-08-13

源自：JavaScript入門篇 4-1

關注問題我要回答

1134

操作

收起

4 回答

qq_一個人的路上_0 回答被采納 +2 積分
2017-08-15

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html lang="en"> <head>? <meta charset="UTF-8">? <meta name="Author" content="">? <meta name="Keywords" content="">? <meta name="Description" content="">? <title>Document</title>? <script src="jquery-3.2.1.js">? </script>? <style type="text/css">? #div1{width:300px;height:300px;}? </style> </head> <body>? <div id="div1" style="background:red;"><h3>111111</h3></div>? <input type="button" onClick="abc()" value="annie"/>??? <script type="text/javascript"> var div1=document.getElementById("div1"); alert(div1);? ? function abc(){ a = confirm("是否要清除");? ? ? ? if(a==true) {? ? ? ? ? ? div1.removeAttribute("style");? ? ? ? }? ? }? </script> </body></html>

0 回復有任何疑惑可以回復我~

收起回答

#1

qq_一個人的路上_0

這是我寫的清楚按鈕，有用，你那個找不到原因

2017-08-15 回復有任何疑惑可以回復我~

#2

二十七杯酒3976242 提問者

非常感謝！

2017-08-15 回復有任何疑惑可以回復我~

web小菜
2017-08-15

<!DOCTYPE HTML>

<html>

<head>

<title>javascript</title>

body{font-size:12px;}

#txt{

? ? height:400px;

? ? width:600px;

border:#333 solid 1px;

padding:5px;}

p{

line-height:18px;

text-indent:2em;}

</style>

</head>

<body>

? <h2 id="con">JavaScript課程</h2>

? <div id="txt">?

? ? ?<h5>JavaScript為網(wǎng)頁添加動態(tài)效果并實現(xiàn)與用戶交互的功能。</h5>

? ? ? ? <p>1. JavaScript入門篇，讓不懂JS的你，快速了解JS。</p>

? ? ? ? <p>2. JavaScript進階篇，讓你掌握JS的基礎語法、函數(shù)、數(shù)組、事件、內(nèi)置對象、BOM瀏覽器、DOM操作。</p>

? ? ? ? <p>3. 學完以上兩門基礎課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。</p>

? </div>

??

? ?<form>

?

? ? <input type="button" value="改變顏色" onclick="changeColor()"> ?

? ? <input type="button" value="改變寬高" onclick="changeHeight()">

? ? <input type="button" value="隱藏內(nèi)容" onclick="hides()">

? ? <input type="button" value="顯示內(nèi)容" onclick="shows()">

? ? <input type="button" value="取消設置" onclick="cancel()">

? </form>

? <script type="text/javascript">

? ? ? ? var con=document.getElementById("con");

? ? ? ? var txt=document.getElementById("txt");

? ?function changeColor(){

? ? ? ? ? ?

? ? //con.style.color="#100000";

? ? //con.style.backgroundColor="#000000";

? ?// txt.style.color="red";;

? ? txt.style.color="red";

? ?}

//定義"改變寬高"的函數(shù)

? ? function changeHeight(){

? ? ? ? ?

? ? ? ? ?//con.style.width="200px";

? ? ? ? ?//con.style.height="100px";

? ? ? ? ?txt.style.width="500px";

? ? ? ? ?txt.style.height="500px";

? ? }

//定義"隱藏內(nèi)容"的函數(shù)

? ? function hides(){

? ? ? ? ?

? ? ? ? ?//con.style.display="none";

? ? ? ? ?txt.style.display="none";

? ? }

//定義"顯示內(nèi)容"的函數(shù)

? ? function shows(){

? ? ? ? ?

? ? ? ? // con.style.display="block";

? ? ? ? ?txt.style.display="block";

? ? }

//定義"取消設置"的函數(shù)

? ? function cancel(){

? ? ? ? var tk=confirm("是否取消？")

? ? ? ? if(tk=true) {

? ? ? ? ? ? txt.removeAttribute("style");

? ? ? ? }

? ? }

? </script>

</body>

</html>

0 回復有任何疑惑可以回復我~

收起回答

web小菜
2017-08-15

就最后少了一個大括號,改回來，有用了，就是最后一個取消設置沒有用。

0 回復有任何疑惑可以回復我~

收起回答

#1

qq_一個人的路上_0

我也調(diào)了很久，愣是找不到為什那個按鈕沒有用

2017-08-15 回復有任何疑惑可以回復我~

慕的地609158
2017-08-13

哥你沒定義變量并且變量沒取值，應該像這樣寫：

?function changeColor(){

? ? var chclo = document.getElementById("txt").style.color="red";

? }

0 回復有任何疑惑可以回復我~

收起回答

#1

二十七杯酒3976242 提問者

我在方法前面定義變量了。

2017-08-14 回復有任何疑惑可以回復我~

#2

二十七杯酒3976242 提問者回復二十七杯酒3976242 提問者

剛看見取消設置方法處的“ture”寫錯了，但改了后還是沒效果

2017-08-14 回復有任何疑惑可以回復我~

#3

qq_一個人的路上_0 回復二十七杯酒3976242 提問者

哥們，幫你調(diào)試了下，最后一個function少了個大括號，，并且你這個函數(shù)應該是想消掉txt的style，你得再聲明一個變量來接收confiem的值，最后才是txt.remove.但是我修改以后還是有問題，第一呢就是這個取消設置并沒有生效，我沒有找到原因，第二呢，我嘗試了多次，當按了隱藏和顯示按鈕后，改變寬高按鈕失效了，改變顏色按鈕可能也失效了，因為沒法檢驗。

2017-08-15 回復有任何疑惑可以回復我~