JQuery動的HTMLページ

-3

ボタンを押すと、別のdivタグがユーザーの画面に表示されます。私は何がうまくいかないかを見るために多くのWebページを試してみました。 Webページのコンソールにエラーはありません。ここにHTMLコードとJavaScriptコードがあります。JQuery動的HTMLページ

/*jslint browser: true*/ 
/*global $, jQuery, alert*/ 

$("buttonId").click(function() { 
    var structure = $("<div>Hello world</div>"); 
    $("#newDiv").append(structure); 
    document.getElementById("div01").style.backgroundColor = "red"; 
}); 



<html> 
    <head> 
     <link rel="stylesheet" href="site.css"> 
     <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
    </head> 

    <body> 
     <nav> 
      <p class="logo"> Logo! </p> 
      <ul id="ul01"> 
       <li><a href="#" class="active">NewsFeed</a></li> 
       <li><a href="#">Discover</a></li> 
       <li><a href="#">Following</a></li> 
      </ul> 
      <div class="logIn"> 
       <a href="#"> Login </a> 
       <a href="#"> Sign Up </a> 
      </div> 
     </nav> 
     <a id="buttonId" href="#"> Click fo anouther div!!</a> 
     <div id=newDiv> 
      <div id=div01> Hello </div> 
     </div> 
     <script src="operations.js"></script> 
    </body> 

</html>

出典

2016-08-15 Jack

'$（ "＃buttonId"）' ... –

'$（ "buttonId"）'だろうか？！あなたの要素と一致しません。 '$（"＃buttonId "）' – Steve

ありがとう、それは今動作します – Jack

$("buttonId")（それはタグbuttonId持つ要素を検索するような）任意の要素と一致しないであろうセレクタです。

それを動作させるためにあなたは$("#buttonId")にそれを変更する必要があります。

出典

2016-08-15 13:36:55

コードに間違いがありました。

$("buttonId").click(function() { 
    var structure = $("<div>Hello world</div>"); 
    $("#newDiv").append(structure); 
    document.getElementById("div01").style.backgroundColor = "red"; 
});

上記のコードでは、 buttonIdの前に＃文字がありません。だからそれは何にもマッチしません。これは修正版あなたのHTMLでも

$("#buttonId").click(function() { 
     var structure = $("<div>Hello world</div>"); 
     $("#newDiv").append(structure); 
     document.getElementById("div01").style.backgroundColor = "red"; 
    });

である、あなたはますnewDivとdiv01のIDS外に二重引用符を置くのを忘れています。ここに訂正版があります

<html> 
    <head> 
     <link rel="stylesheet" href="site.css"> 
     <script src="https://code.jquery.com/jquery-1.10.2.js"></script> 
    </head> 

    <body> 
     <nav> 
      <p class="logo"> Logo! </p> 
      <ul id="ul01"> 
       <li><a href="#" class="active">NewsFeed</a></li> 
       <li><a href="#">Discover</a></li> 
       <li><a href="#">Following</a></li> 
      </ul> 
      <div class="logIn"> 
       <a href="#"> Login </a> 
       <a href="#"> Sign Up </a> 
      </div> 
     </nav> 
     <a id="buttonId" href="#"> Click fo anouther div!!</a> 
     <div id="newDiv"> 
      <div id="div01"> Hello </div> 
     </div> 
     <script src="operations.js"></script> 
    </body> 

</html>

出典

2016-08-15 13:38:16

$（ 'buttonId'）の前に '＃'記号がないように見えます。

だから、それは次のようになります。

$("#buttonId").click(function() { 
     var structure = $("<div>Hello world</div>"); 
     $("#newDiv").append(structure); 
     document.getElementById("div01").style.backgroundColor = "red"; 
    });

乾杯、

デビッド

出典

2016-08-15 13:43:11

JQuery動的HTMLページ

答えて

関連する問題