为什么/该网页不包含任何JavaScript？

问题描述

| http://www.carto.net/papers/svg/samples/jumping_cubes.svg （真的希望这个问题不会被解决）     

解决方法

如您在源代码中所见，它使用SVG动画。

<?xml version=\"1.0\" encoding=\"UTF-8\"?>
<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.0//EN\" \"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd\" [
  <!ENTITY dur \"2s\">
  <!ENTITY values     \"0;    -45;      0;     16;      0;     -7;      0;      3;      0;     -2;      0;      1; 0\">
  <!ENTITY keyTimes   \"0; 0.2564; 0.5128; 0.6154; 0.6923; 0.7436; 0.7949; 0.8462; 0.8974; 0.9231; 0.9487; 0.9744; 1\">
  <!ENTITY keySplines \"0 .75 .5 1; .5 0 1 .25; 0 .25 .25 1; .5 0 1 .5; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1; 0 0 1 1\">
  <!ENTITY calcMode \"spline\">
  <!ENTITY begin \"mouseover\">
]>
<svg width=\"665\" height=\"250\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 665 250\" xml:space=\"preserve\">
  <title>SVG Animation - Cube Demonstration</title>

  <!-- example originally from Antoine Quint,stolen from \"Digging Animation\" at http://www.xml.com/pub/a/2002/01/23/svg/index.html -->
  <!-- fixes by A. Neumann (added namespaces,changed DTD and replaced style attributes with presentation attributes -->
  <defs>
    <symbol id=\"cube\" stroke=\"#000000\" stroke-width=\"0.5\" stroke-linejoin=\"bevel\">
      <path fill=\"#333333\" d=\"M0.112,26.271l25.032,12.485V25.164L0.112,12.68V26.271z\"/>
      <path fill=\"#666666\" d=\"M25.144,38.756l25.033-12.485H50.12V12.708L25.144,25.164V38.756z\"/>
      <path fill=\"#cccccc\" d=\"M50.12,12.708l0.057-0.028L25.144,0.224L0.112,12.68l25.032,12.484L50.12,12.708z\"/>
    </symbol>
  </defs>

  <rect width=\"100%\" height=\"100%\" fill=\"#999999\" stroke=\"none\" />

  <g id=\"cubes\" transform=\"translate(300.25,143.45)\" >
    <use xlink:href=\"#cube\" transform=\"translate(0,-72)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(24,-60)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>

    <use xlink:href=\"#cube\" transform=\"translate(48,-48)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(-24,-60)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(0,-48)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>

    <use xlink:href=\"#cube\" transform=\"translate(-48,-48)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(24,-36)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(-24,-36)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>

    <use xlink:href=\"#cube\" transform=\"translate(-72,-36)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(72,-36)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(48,-24)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>

    <use xlink:href=\"#cube\" transform=\"translate(-48,-24)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(0,-24)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(24,-12)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>

    <use xlink:href=\"#cube\" transform=\"translate(-24,-12)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
    <use xlink:href=\"#cube\" transform=\"translate(0,0)\">
      <animate  dur=\"&dur;\" values=\"&values;\" keyTimes=\"&keyTimes;\" keySplines=\"&keySplines;\"
                attributeName=\"y\" begin=\"&begin;\" restart=\"whenNotActive\" calcMode=\"&calcMode;\" />
    </use>
  </g>
  <a xlink:href=\"http://www.xml.com/pub/a/2002/01/23/svg/index.html\"><text font-size=\"12px\" text-anchor=\"middle\" x=\"332.5\" y=\"245\">Example provided by A. Quint (published in Sacré SVG column at O\'Reilly),Modifications by A. Neumann</text></a>

</svg>

    ,ѭ1已经包含了此类动画所需的所有数据（过渡，悬停行为等）。 不需要javascript。