javascript - 解析该网站的正确方法是什么？

Question

场景:

我有一个学校的网站，我正在尝试获取有关可用时间表的信息。他们有一个适用于所有类(class)的工具，它是一种 PHP 形式，可以在此处选择您的类(class)后发送帖子信息:

https://campus.concordia.ca/psc/pscsprd/EMPLOYEE/HRMS/c/CU_EXT.CU_CLASS_SEARCH.GBL

对于小样本，我会选择:

1. 学期:2016 年秋季
2. 类(class)职业:本科生
3. 选择主题: CIVI

我对 Javascript/jQuery 还很陌生，所以我不确定我有哪些可用选项。网站的布局也很难导航...

我尝试过的事情:

var elems = document.body.getElementsByTagName("span");
for (var i =0 ; i <elems.length;i++){
console.log(elems[i]);
}

我最初的尝试是识别元素结构并隔离文本，不幸的是它提供了太多东西。

但是我注意到元素模式遵循的命名约定，所以我将 jQuery 库复制粘贴到控制台中并执行了以下操作:

//for the details of the courses
var tempArray =  $('[id^="MTG_"]').map(function() { return this.innerText}).get().join();

//for the name of the courses
$('[id^="SSR_CLSRSLT_WRK_GROUPBOX2"]').map(function() {return this.title}).get().join();

TL;DR 问题:

类(class)名称和所有详细信息不是通过数字顺序关系链接在一起的。取而代之的是 信息在ID下被分成海量表格:

$('[id^="ACE_SSR_CLSRSLT_WRK_GROUPBOX2"]')其中还包含类(class)的名称。然后在大量的 td/tr 之后，它具有类(class)的详细信息。

有没有办法连续两次使用选择器来隔离需要的东西？例如，像这样:

//I know this doesn't work but something like this would be nice

$('[id^="ACE_SSR_CLSRSLT_WRK_GROUPBOX2"]'). $('[id^="MTG_"]').map(function() { return this.innerText}).get().join();

或者有更好的方法吗？

Answer 1

您可以像这样使用 jquery find() 方法:

$('[id^="ACE_SSR_CLSRSLT_WRK_GROUPBOX2"]').find('[id^="MTG_"]').map(function() {
    return this.innerText
}).get().join();

这将找到“MTG_”元素，它们是“ACE_SSR_CLSRSLT_WRK_GROUPBOX2”的子元素(包括直接子元素和更深的子元素)。