                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /JavaScript入門篇

求助，寫完點擊無任何效果

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" Content="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css">
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為網頁添加動態效果并實現與用戶交互的功能。</h5>
? ? ? ?<p>1. JavaScript入門篇，讓不懂JS的你，快速了解JS。</p>
? ? ? ?<p>2. JavaScript進階篇，讓你掌握JS的基礎語法、函數、數組、事件、內置對象、BOM瀏覽器、DOM操作。</p>
? ? ? ?<p>3. 學完以上兩門基礎課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。</p>
?</div>
?<form>
?
? ?<input type="button" value="改變顏色" onclick="set.gbys()">
? ?<input type="button" value="改變寬高" onclick="set.gbkg()">
? ?<input type="button" value="隱藏內容" onclick="set.ycnr()">
? ?<input type="button" value="顯示內容" onclick="set.xsnr()">
? ?<input type="button" value="取消設置" onclick="set.qxsz()">
?</form>
?<script type="text/javascript">
? var txt=document.getElementById("txt");
? var set={
gbys:function(){
? txt.style.color="red";
? txt.style.backgroundColor="#ccc";
}
gbkg:function(){
txt.style.width="300px";
txt.style.height="300px";
}
ycnr:function(){
txt.style.display="none";
}
xsnr:function(){
txt.style.display="block";
}
qxsz:function(){
var qxcz=confirm("是否取消設置？")
if (qxcz==true){
txt.removeAttribute('style');
}
}
}
?</script>
</body>
</html>

sejeze

2015-07-11

源自：JavaScript入門篇 4-1

關注問題我要回答

1192

操作

收起

2 回答

柳寒煙
2015-07-21

a beautiful code

<!DOCTYPE HTML>

<html>

<head>

<title>javascript</title>

body{font-size:12px;}

#txt{

? ?height:400px;

? ?width:600px;

? ?border:#333 solid 1px;

? ?padding:5px;}

? ?line-height:18px;

text-indent:2em;}

</style>

</head>

<body>

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

?<div id="txt">?

? ? <h5>JavaScript為網頁添加動態效果并實現與用戶交互的功能。</h5>

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

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

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

?</div>

?<form>

?

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

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

? ?<input type="button" value="隱藏內容" onclick="set.ycnr()">

? ?<input type="button" value="顯示內容" onclick="set.xsnr()">

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

?</form>

?<script type="text/javascript">

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

? var set=

{

? ? ? ? ? gbys:function(){

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

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

? ? ? ? ? },

? ? ? ? ? gbkg:function(){

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

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

? ? ? ? ? },

? ? ? ? ? ycnr:function(){

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

? ? ? ? ? },

? ? ? ? ? xsnr:function(){

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

? ? ? ? ? },

? ? ? ? ? qxsz:function(){

? ? ? ? ? var qxcz=confirm("是否取消設置？")

? ? ? ? ? if (qxcz==true)

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

? ? ? ? ? }

}

?</script>

</body>

</html>

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

收起回答

Perona
2015-07-11

缺了逗號，在每個函數外面加個,即可。

<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?Content="text/html;?charset=utf-8"?/>
<title>javascript</title>
<style?type="text/css">
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為網頁添加動態效果并實現與用戶交互的功能。</h5>
???????<p>1.?JavaScript入門篇，讓不懂JS的你，快速了解JS。</p>
???????<p>2.?JavaScript進階篇，讓你掌握JS的基礎語法、函數、數組、事件、內置對象、BOM瀏覽器、DOM操作。</p>
???????<p>3.?學完以上兩門基礎課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。</p>
?</div>
?<form>
?<!--當點擊相應按鈕，執行相應操作，為按鈕添加相應事件-->
???<input?type="button"?value="改變顏色"?onclick="set.gbys()">
???<input?type="button"?value="改變寬高"?onclick="set.gbkg()">
???<input?type="button"?value="隱藏內容"?onclick="set.ycnr()">
???<input?type="button"?value="顯示內容"?onclick="set.xsnr()">
???<input?type="button"?value="取消設置"?onclick="set.qxsz()">
?</form>
?<script?type="text/javascript">
??var?txt=document.getElementById("txt");
??var?set={
gbys:function(){
??txt.style.color="red";
??txt.style.backgroundColor="#ccc";
},
gbkg:function(){
txt.style.width="300px";
txt.style.height="300px";
},
ycnr:function(){
txt.style.display="none";
},
xsnr:function(){
txt.style.display="block";
},
qxsz:function(){
var?qxcz=confirm("是否取消設置？")
if?(qxcz==true){
txt.removeAttribute('style');
}
}
}
?</script>
</body>
</html>