0

我遇到的问题似乎有一个简单的答案。我想让我的网站完成从网页中抓取一段文本的简单任务。

我基本上希望我的代码看起来像......

var str = TextFromWebPage;

我要“抓取”的文字在http://dasd-sharepoint.dasd.org/Schools/STEMAcademy/Pages/default.aspx

如果您在页面上查看（尝试使用 Control F 并搜索当前日期，例如：）"May-9-2013:"以获取接下来五个日期的列表。我想获取该列表并在 Javascript 中的变量中使用它。

所以我更喜欢的最终结果是

var str = new Array("May-9-2013: “F” Day", "May-10-2013: “G” Day", "May-13-2013: “H” Day", "May-14-2013: “I” Day", "May-15-2013: “J” Day", "May-16-2013: “K” Day");

目的：基本上为了学校我总是检查时间。因此，我没有做数学运算，而是做了一个快速的小程序，查看当前时间与当前课程结束的时间。然而，在我的学校，我们有不同的“字母日”，这意味着不同日子的课程长度不同。字母天数以 12 天为周期，这意味着。周一到周五可能是AE，但这意味着下一周的周一将是FJ。更不用说是否有下雪天或休息日。因此，与其使用日历，我认为必须有一种方法可以从该地区的网页中获取这些数据，并在代码中使用它来自动检查它是哪一天的字母。

感谢您的任何帮助！

这是我正在做的事情的代码......

<!DOCTYPE html>
<html>
     <head>
        //<link rel="stylesheet" type="text/css" href="graphics.css">
        <script>
            //==========|  Data  |==========
            //These array lists contain the times the class periods start, end, and their title
            var Ptest = new Array("starts: 07:25 ends: 15:00 title: Testing", "starts: 07:25 ends: 30:00 title: Testing");
            var P14 = new Array("starts: 07:25 ends: 09:00 title: Pd: 1", "starts: 09:04 ends: 10:34 title: Pd: 2", "starts: 10:38 ends: 11:08 title: Lunch", "starts: 11:12 ends: 12:42 title: Pd: 3", "starts: 12:46 ends: 14:23 title: Pd: 4");
            var P17 = new Array("starts: 07:25 ends: 08:20 title: Pd: 1", "starts: 08:24 ends: 09:14 title: Pd: 2", "starts: 09:18 ends: 10:08 title: Pd: 3", "starts: 10:12 ends: 11:02 title: Pd: 4", "starts: 11:06 ends: 11:36 title: Lunch", "starts: 11:40 ends: 12:30 title: Pd: 5", "starts: 12:34 ends: 13:24 title: Pd: 6", "starts: 13:28 ends: 14:23 title: Pd: 7");
            var P57 = new Array("starts: 07:25 ends: 09:00 title: Pd: 5", "starts: 09:04 ends: 10:34 title: Pd: 6", "starts: 10:38 ends: 11:08 title: Lunch", "starts: 11:12 ends: 12:42 title: Pd: 7", "starts: 12:46 ends: 13:36 title: Advisory", "starts: 13:40 ends: 14:23 title: Seminar");
            //---------------------------------

            //==========|  Variables  |==========
            var input = P17; //What set of data to use
            var currentSlot = 0; //What the current Period is
            var over = false; //If the current school day if over
            //---------------------------------

            //==========|  Actions  |==========
            window.onload=function() {
                setInterval(function() {refresh();}, 1); //Loop
            }

            //---------------------------------


            //==========|  Core Functions  |==========
            function refresh() {
                display();
                updateClock();
            }

            function display() {
                var currentTime = getTime();
                var timeInSec = ((parseInt(currentTime.slice(0,2)))*3600)+((parseInt(currentTime.slice(3,5)))*60)+(parseInt(currentTime.slice(6,8)));

                if (currentSlot >= input.length) {over = true;}
                if (over == false) {
                    var data = input[currentSlot];
                    var nextSlot = input[currentSlot + 1];

                    var PdEndTime = ((parseInt(data.slice(20,23)))*3600)+((parseInt(data.slice(23,25)))*60);

                    var PdStart = data.slice(8,13);
                    var PdEnd = data.slice(20,25);
                    var PdTitle = data.slice(32,data.length);

                    if (nextSlot!==undefined) {
                        var NPdStart = nextSlot.slice(8,13);
                        var NPdEnd = nextSlot.slice(20,25);
                        var NPdTitle = nextSlot.slice(32,nextSlot.length);
                    }

                    var timeLeft = PdEndTime - timeInSec;
                    var hLeft = Math.floor(timeLeft / 3600);
                    var mLeft = Math.floor(timeLeft / 60);
                    var sLeft = Math.floor(timeLeft % 60);

                    if (hLeft > 0) {mLeft = mLeft - (hLeft*60);}

                    hLeft = add0(hLeft);
                    mLeft = add0(mLeft);
                    sLeft = add0(sLeft);

                    if (timeInSec > PdEndTime) {currentSlot++;}

                    document.getElementById("display").innerHTML = PdTitle+" ends at "+PdEnd+", in "+hLeft+":"+mLeft+":"+sLeft;
                }
                else {document.getElementById("display").innerHTML = "School is over!";}
            }

            //---------------------------------

            //==========|  Misc Functions  |==========


            function getTime() {
                var clock = new Date();
                var h = clock.getHours();
                var m = clock.getMinutes();
                var s = clock.getSeconds();

                h = add0(h);
                m = add0(m);
                s = add0(s);

                return h+":"+m+":"+s;
            }

            function updateClock() {
                document.getElementById("clock").innerHTML = getTime();
            }

            function add0(i) {
                if (i < 10) {
                    i  = "0"+i;
                }
                return i;
            }

            function changeInput(newInput) {
                input = newInput;
                currentSlot = 0;
            }
            //---------------------------------
        </script>
     </head>
    <body>
        <p id="clock" class="textCenter"></p>
        <p id="display" class="textCenter"></p>
        <p class="textCenter">
        <input type="button" onClick="changeInput(P14)" value="1-4 Block">
        <input type="button" onClick="changeInput(P17)" value="1-7 Normal">
        <input type="button" onClick="changeInput(P57)" value="5-7 Block">
        </p>
    </body>
</html>

我希望它能够简单地自动检查今天是哪一天，这样您就不必让用户单击按钮。例如 A 天 = 1-7、B 天 = 1-4、C 天 = 1-7、D 天 = 5-7

4

2 回答 2

1

这是获取您需要的信息的代码（如果页面没有更改）。您必须在 Firefox 中使用 forcecors（并激活它），按 F12 以查看记录到控制台的值数组。

[更新] 忘了说你也必须使用 jQuery。将 jquery-1.9.0.js 放在与 html 相同的目录中。

<!DOCTYPE html>
<html>
 <head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Example</title>
<script type="text/javascript" src="jquery-1.9.0.js"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(document).ready(function(){
  var url="http://dasd-sharepoint.dasd.org/Schools/STEMAcademy/Pages/default.aspx";
  $.get(url,function(res){
    var p = new DOMParser();
    var doc = p.parseFromString(res, "text/html");
    var anchors=$(doc).find(".dfwp-column")[0].getElementsByTagName("a");
    var arr=[];
    for(var i=0;i<anchors.length;i++){
      arr.push(anchors[i].textContent);
    }
    console.log(arr);
  });

});
</script>
</head>
 <body>
<div class="bigDiv">Big</div>
<div class="smallerDiv">Small</div>
</html>
于 2013-05-09T15:51:14.103 回答
1

如果您从另一个网站执行此操作，最好的办法是在您的网站上使用使用 PHP 或 ASP 或任何其他服务器端编程语言的辅助页面来抓取该页面并返回其内容，而您可以在该服务器端语言中使用强大的正则表达式并返回您需要的 JSON 对象。这里真正的问题是您不能从yoursite.com转到dasd-sharepoint.dasd.org/Schools/STEMAcademy/Pages/default.aspx，这在传统的 java 脚本环境中根本不可能。

我得出结论的原因是，在执行 XMLHttpRequest (XHR) 时，浏览器的设计目的是不访问其他网站。即使是这样，从技术上讲，他们的网络服务器应该拒绝从另一个域通过 XHR 进行访问，这被称为跨域请求，并且在 javascript 中是不可能的。

使用辅助页面来获取此内容的效率会更高，并且不需要附加组件即可使用此功能/网站。这使您可以精确控制您的功能并轻松移植到大多数主机。它还允许任何客户能够访问此页面并利用其功能。

使用附加组件从来都不是做某事的正确方法，总有更好更简单的方法。

现在到另一个网站上做这件事的 HTML5 好东西

如果您对远程主机发送的标头有发言权，您可以让他们发送“Access-Control-Allow-Credentials: true”标头，这将允许处理 XMLHttpRequest2 aka CORS 请求，您可以查看有关此主题的更多信息在以下网址：http ://www.html5rocks.com/en/tutorials/cors/

不幸的是，我对 CORS 没有任何经验，所以我没有任何有用的操作方法或其他任何东西，它与典型的 ajax 请求非常相似，只要远程方允许它就支持跨域（Control-Allow -Credentials: True) 并且系统格式正确，当然这并不能真正给您提供很多帮助，但希望可以为您提供有关制作正确系统的信息。

如果您在同一个网站上执行此操作（比如说同一网站/域 dasd-sharepoint.dasd.org的不同页面，那么有一些简单的方法可以获取此信息。解析网页上的所有信息可以是开始时的过程很艰难，但应该不会很糟糕。我将在今天晚些时候写更多关于这个主题的文章，因为我必须开始。

于 2013-05-09T17:20:35.557 回答