1

我有一个string我正在使用string.split(' ');的拆分，以便将字符串转换为数组。

假设我有这两个表，table1并且table2.

<table border="1" id="table1">
    <tr>
        <th colspan="2">Image One</th>
    </tr>
    <tr>
        <td style="width:40%;"><img src="airplane.jpg" alt="Image 1"></td>
        <td>
            <dl>
              <dt>airplane</dt>
              <dt>flight</dt>
              <dt>travel</dt>
              <dt>military</dt>
              <dt>word war</dt>
              <dt>GI</dt>
            </dl>
        </td>
    </tr>
</table>

<table border="1" id="table2">
    <tr>
        <th colspan="2">Image Two</th>
    </tr>
    <tr>
        <td style="width:40%;"><img src="apple.jpg" alt="Image 1"></td>
        <td>
            <dl id="tags">
              <dt>red</dt>
              <dt>apple</dt>
              <dt>round</dt>
              <dt>fruit</dt>
              <dt>healthy</dt>
              <dt>doctor</dt>
            </dl>
        </td>
    </tr>
</table>

现在出于测试目的，我有一个 id 的tagson table2's dl。

我正在使用一个函数将DL(#tags) 转换为一个数组

function getArray(id) {
var node, list, arrValue;

    array = [];
    for (node = document.getElementById(id).firstChild;
        node;
        node = node.nextSibling) {
        if (node.nodeType == 1 && node.tagName == 'DT') {
            array.push(node.innerHTML);
        }
    }
    console.log(array)
}

为了对照我的原件检查它string，看看是否有任何值匹配。但是，我将要检查多个DT's string。将所有表添加到 3d 数组中然后检查 3d 数组中的值是否正确string？还是有更好的方法？

更新

问题是：

我最终将有一张充满图像和标签的表格。本质上，我希望能够根据我的字符串（将被分成一个数组）搜索这些标签，然后返回字符串中标签最多的图像。我试图找出最好的方法来做到这一点。谢谢

4

2 回答 2

3

而不是一个数组，我会使用 anObject来存储标签列表，其中键是标签，值是无关紧要的。

这将为您提供 O(1) 查找来检查该列表中是否存在其他字符串，而不是使用 O(n) 查找array.indexOf()。

下面的函数将找到页面上的每个 DT，然后返回一个对象，其中包含从每个 DT 的文本到其父 DL 的 ID 的映射。

function makeMap() {
    var map = {};
    var dls = document.getElementsByTagName('DL');
    for (var i = 0, n = dls.length; i < n; ++i) {
        var dl = dls[i];
        var id = dl.id;
        var node = dl.firstChild;
        while (node) {
            if (node.nodeType == 1 && node.tagName == 'DT') {
                var tag = node.textContent || node.innerText; // latter for MSIE
                map[tag] = id;
            }
            node = node.nextSibling;
        }
    }
    return map;
}

或者，在 jQuery 中（为了提高效率，混合了一些纯 JS）：

function makeMap2() {
    var map = {};
    var $dt = $('dl > dt');
    $dt.each(function() {
        var tag = this.textContent || this.innerText;
        map[tag] = this.parentNode.id;
    });
    return map;
}
于 2012-12-19T19:34:57.003 回答
1

您不会使用 3 维数组，而只能使用带有表格及其标签的二维数组。或者，正如 Alnitak 已经提到的，更好的查找对象：

var map = {};
var dls = document.getElementsByTagName('dl');
for (var i = 0, i < dls.length; i++) {
    var tableid = dls[i].id; // identifier?
    var dts = dls[i].getElementsByTagName('dt'); // assuming you don't nest them
    for (var j = 0; j < dts.length; j++) {
        var text = dts[j].textContent || dts[i].innerText;
        var tags = text.split(/\s+/);
        for (var k=0; k<tags.length; k++)
            if (tags[k] in map)
                map[tags[k]].push(tableid);
            else
                map[tags[k]] = [tableid]; // an array
    }
}
/* now, map could look like this:
{
    word: ["table1"],
    war: ["table1"],
    red: ["table2"],
    double: ["table1", "table2"], // tags in more than one table
    …
}
*/

要获取字符串中标签最多的表，您现在可以使用这样的函数，该函数返回按标签出现排序的相应 tableid：

function getHighestTables(string) {
    var tags = string.split(/\s+/);
    var tablecounts = {};
    for (var i=0; i<tags.length; i++) {
        var tables = map[tags[i]] || [];
        for (var j=0; j<tables.length; j++) {
            var tableid = tables[j];
            if (tableid in tablecounts)
                tablecounts[tableid]++;
            else
                tablecounts[tableid] = 1;
        }
    }
/*  tablecounts might now look like this:
    {
        table1: 2
        table2: 5
    }
*/
    return Object.keys(tablecounts).sort(function (a, b) {
        return tablecounts[b] - tablecounts[a];
    });
}
于 2012-12-19T20:15:41.590 回答