消除类似脚本中的重复

时间:2018-02-13 20:30:48

标签: javascript

我有一系列网页价格变化很快,并且由于某种限制,我需要所有页面来查询动态更新的某个XML文件。

这就是我拼凑在一起的东西,尽管它工作得很好,但我确信我过度了,并为每个价格线添加一个完整的脚本充其量只是笨重。

<h4> <script>
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","flightprice.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 
var x=xmlDoc.getElementsByTagName("CD");
for (i=0;i<x.length;i++)
  { 
  document.write(x[i].getElementsByTagName("EACH2PAX1")[0].childNodes[0].nodeValue);
  document.write(" per person / Duration: 30 minutes, 2 passenger minimum. ");
  } 
</script></h4>


<h4> <script>
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","flightprice.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 
var x=xmlDoc.getElementsByTagName("CD");
for (i=0;i<x.length;i++)
  { 
  document.write(x[i].getElementsByTagName("EACH3PAX1")[0].childNodes[0].nodeValue);
  document.write(" per person with passengers");
  } 
</script></h4>

由于每个脚本都是IDENTICAL,除了每个脚本中的document.write值,我希望有一个更简洁的方法。

请原谅我的无知......我已经13岁了,正试着用我可以使用的工具学习。

谢谢

1 个答案:

答案 0 :(得分:0)

好工作Farhat。您需要的是对procedural programming principles的介绍。

您可以将公共代码分组到一个函数中。由于您创建了两次XMLHttp对象,因此可以将其放入函数

function getXmlHttp() {
    var xmlhttp;
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
      }
      else
      {// code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    return xmlhttp;
}

然后你可以在你的代码中调用它:

var xmlhttp = getXmlHttp();
xmlhttp.open("GET","flightprice.xml",false);
xmlhttp.send();
...

这只是一个开始。您可以使用更多地方使代码更加模块化。这个过程称为重构。