請問為什么我的代碼只能顯示出文本內(nèi)容,但是點擊按鈕都完全沒有變化?
<!DOCTYPE HTML>
<html>
? ?<head>
? ? ? <meta http-equiv="Content-Type" content="text/html;charset=bg2312"/>
? ? ? <title>綜合編程練習</title>
? ? ? <style type="text/css">
? ? ? ? ? *{font-size:12px}
?#txt{width:200px;height:400px;border:#333 solid 1px;padding:5px}
?p{line-height:20px;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、入門篇</p>
<p>2、進階篇</p>
<p>3、深入學習</p>
? ? ? </div>
? ? ? <form>
? ? ? ? ? <input type="button" name="button" value="改變顏色" onClick="set.color()"/>
?<input type="button" name="button" value="改變尺寸" onClick="set.size()"/>
?<input type="button" name="button" value="隱藏文本" onClick="set.hide()"/>
?<input type="button" name="button" value="顯示文本" onClick="set.show()"/>
?<input type="button" name="button" value="恢復設置" onClick="set.remove()"/>
? ? ? </form>
? ? ? <script type="text/javascript">
? ? ? ? ? var mychar=document.getElementById("txt");
?var set={
? ? color:function(){
? ? ? ?mychar.style.color="red";
mychar.style.background="blue";
? ? }
? ? size:function(){
? ? ? ?mychar.style.width="400px";
? ? ? ? ? ? ? ? mychar.style.heoght="200px";
? ? }
? ? hide:function(){
? ? ? mychar.style.display="none";
? ? }
? ? show:function(){
? ? ? mychar.style.display="block";
? ? }
? ? remove:function(){
? ? ? ?var sure=confirm("確認恢復設置?");
if(sure==true)
{mychar.removeAttribute('style');}
? ? } ?
? ? ? }
? ? ? </script>
? ?</body>
</html>
2017-02-21
把 mychar ?改成 con
2017-02-21
我試了下,改成下面就可以了:
var set={
? ? ? ? ? ? color:function(){
? ? ? ? mychar.style.color="red";
? ? ? ? mychar.style.background="blue";
? ? ? ? ? ? },
? ? ? ? ? ? size:function(){
? ? ? ? mychar.style.width="400px";
? ? ? ? mychar.style.heoght="200px";
? ? ? ? ? ? },
? ? ? ? ? ? hide:function(){
? ? ? ? mychar.style.display="none";
? ? ? ? ? ? },
? ? ? ? ? ? show:function(){
? ? ? ? mychar.style.display="block";
? ? ? ? ? ? },
? ? ? ? ? ? remove:function(){
? ? ? ? var sure=confirm("確認恢復設置?");
? ? ? ? if(sure==true)
? ? ? ? mychar.removeAttribute('style');
? ? ? ? },
? ? ? ? };
2017-02-21
你的set{}沒有生成實例,最后加一條:
var set1 = Object.create(set);
改:
?<input type="button" name="button" value="改變尺寸" onClick="set1.size()"/>