Question

我正在进行一项任务，以获取横幅以显示带有JavaScript的随机图像。我的功能randInt()，adDescription()和adLink()已经提供给我。我基本上只需要调用这些函数来显示随机广告。我在元素中创建了一个id为'value maps'的脚本。我无法显示图像，即img src代码。任何帮助将不胜感激！这是我的代码：

<?xml version="1.0" encoding="UTF-8" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!-- 
   New Perspectives on HTML and XHTML 5th Edition
   Tutorial 10
   Case Problem 2

   The Ridgewood Herald Tribune
   Author: Collin Klopstein  
   Date: November 15, 2013   

   Filename:         front.htm
   Supporting files: ads1.jpg - ads5.jpg, ads.js, fp.jpg, front.htm, logo.jpg, random.js, 
                     styles.css
-->
   <title>The Ridgewood Herald Tribune</title>
   <link href="styles.css" rel="stylesheet" type="text/css" />

   <script type="text/javascript">
        function randInt(n) {
            randNum = Math.ceil(Math.random()*n);
            return randNum;
        }

        function adDescription(n) {
            var descrip = new Array();
            descrip[1]="[AD] Diamond Health Club - For all your Health Club Needs";
            descrip[2]="[AD] Pixal - Quality Digital Equipment and Accessories";
            descrip[3]="[AD] dHome - Quality Geodesic Domes and Homes";
            descrip[4]="[AD] Dunston Retreat Center - get away";
            descrip[5]="[AD] LanGear - Quality Network Solutions for all your Business Needs";

            return descrip[n];
        }

        function adLink(n) {
            var link = new Array();
            link[1]="http://www.diamondhealth.com";
            link[2]="http://www.pixalproducts.com";
            link[3]="http://www.dhome.com";
            link[4]="http://www.dunstonretreats.com";
            link[5]="http://wwww.langearproducts.com";

            return link[n];
        }
   </script>

</head>

<body>

<div id="links">
  <h1>Contents</h1>
  <p class="section">Main</p>
  <p class="linksub">
     <a href="#">Home</a><br />
     <a href="#">Subscriptions</a><br />
     <a href="#">Contact Us</a><br />
     <a href="#">News Sources</a><br /><br />
  </p>
  <p class="section">News</p>
  <p class="linksub">
    <a href="#">Local</a><br />
    <a href="#">National</a><br />
    <a href="#">International</a><br />
  </p>

  <p class="section">Sports</p>
  <p class="linksub">
    <a href="#">Baseball</a><br />
    <a href="#">Basketball</a><br />
    <a href="#">Football</a><br />
    <a href="#">Golf</a><br />
    <a href="#">Hockey</a><br />
    <a href="#">Miscellaneous</a><br />
  </p>

  <p class="section">Opinion</p>
  <p class="linksub">
    <a href="#">Editorials</a><br />
    <a href="#">Columnists</a><br />
    <a href="#">Letters</a><br />
  </p>

  <p class="section">Classifieds</p>
  <p class="linksub">
    <a href="#">Employment</a><br />
    <a href="#">For Sale</a><br />
    <a href="#">Personals</a><br />
    <a href="#">Real Estate</a><br />
    <a href="#">Wanted</a><br />
  </p>

  <p class="section">Other</p>
  <p class="linksub">
    <a href="#">Business</a><br />
    <a href="#">Weather</a><br />
    <a href="#">Entertainment</a>
  </p>
</div>

<div id="main">
  <div id="ads">
      <script type="text/javascript">
        var rNumber = randInt(5); //generate a random integer form 1 to 5
        var rAd = adDescription(rNumber); //description of the random ad
        var rLink = adLink(rNumber); //URL of the random ad

        document.write("<a href='" + rLink + "'>");
        document.write("img src='ad" + rNumber + ".jpg' alt='" + rAd + "' />");
        document.write("</a>");

      </script>
  </div>

  <div id="request"><a href="#">Contact us today to place your ad</a></div>

  <p id="logo"> 
     <img src="logo.jpg" alt="Ridgewood Herald Tribune" />
  </p>

  <p id="fp">
  <img src="fp.jpg" alt="" />
  </p>

  <h2>Park Opens</h2>
  <p id="intro">The <i>Adventure Island</i> theme park opened its doors on 
  Monday near Ridgewood. The park, one of the biggest in New Jersey, drew
  large crowds, but the long lines didn't deter anyone. "I've been watching
  them put up the rides over the last year, it's really exciting to finally
  get inside the gates!" said Ridgewood resident, Denise Brooks.</p>

  <p class="cont"><a href="#">story continues on page 2...</a></p>

  <address id="footer">
  <b>Ridgewood Herald Tribune</b> &nbsp;&#176;&nbsp; 10010 Atwood Ave. 
  &nbsp;&#176;&nbsp; Ridgewood, NJ &nbsp; &nbsp; 07451<br />
  Phone: (201)555-1101 &nbsp;&#176;&nbsp; Fax: (201)555-1102
  </address>
</div>

</body>
</html>

Answer 1

显示图片的HTML缺少一个领先的＆lt;这是问题还是错字？

    document.write("img src='ad" + rNumber + ".jpg' alt='" + rAd + "' />");

应该是：

    //              <
    document.write("<img src='ad" + rNumber + ".jpg' alt='" + rAd + "' />");

另请注意，在函数中声明固定数组略显阴影，因为每次调用函数时，这些数组都会被重新初始化。数组应该可以简单地在函数外声明和初始化。

Answer 2

当我检查Firebug中的HTML时，这就是我得到的。你错过了“＆lt;”在图片标签上。

img src='ad2.jpg' alt='[AD] Pixal - Quality Digital Equipment and Accessories' />

Answer 3

我刚刚为我们的网站hunt-club.org启动了一个广告服务器，我想共享展示广告的代码：

<!DOCTYPE html>
<html><a id="quote"><img id="quoteimg" width=609 height="120"></a><button id="skipad" onclick="window.location.href='https://codeprojects.org/_uLaNvBTx-FcGfHyDjXb0gtobzURizMHlxxylr5Cf3E/ad1skip.html'" class="adskip">X</button>

<style>
  .adskip {
    position: absolute;
    left: 600px;
  }
  </style>
  



  <script src="https://codeprojects.org/_uLaNvBTx-FcGfHyDjXb0gtobzURizMHlxxylr5Cf3E/ad1.js">
    
  </script>
  <head>
    
  </head>
  <body>
    
  </body>
</html>

我试图在页面加载JavaScript时显示随机广告的横幅

3 个答案: