Question

我有一些看起来像这样的HTML 我需要针对不同std-address类的address1范围，城市范围和状态范围类的innerHTML内容。

<div id="result-list">
            <div class="data">
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
                    <p class="std-address">
                        <span class="address1 range">some html content</span>
                        <span class="city range">some html content</span>
                        <span class="state range">some html content</span>

                    </p>
            </div>
</div>

我编写了下面提到的代码，该代码工作正常，直到我在IE 8及以下测试

var addArrayX = document.getElementById("result-list").getElementsByClassName("std-address");


            for (i=0;i<addArrayX.length;i++){
                var address = addArrayX[i];
                stLine1 = trim(((address.getElementsByClassName("address1 range"))[0]).innerHTML);
                city = trim(((address.getElementsByClassName("city range"))[0]).innerHTML);
                state =  trim(((address.getElementsByClassName("state range"))[0]).innerHTML);
            }

请帮助我使这个代码IE兼容（使用js优先或使用jQuery）

这是html的链接 http://jsfiddle.net/H3HRN/9/

Answer 1

通常，如果单个DOM函数不可用，请使用polyfill在不支持的浏览器中实现类似功能。对于许多功能，[name of method] + polyfill的Google搜索功能会为您找到一小段js代码，您可以在页面中添加这些代码以使您的js跨浏览器工作。 Here's one for getElementsByClassName

但是，如果你发现自己不得不填充很多DOM方法，那么最好包含一个像jQuery / Sizzle这样的库。

Answer 2

jQuery方式：

var innerHTML = $('.className').html();

如果你想要resultList id：

的孩子

var innerHTML = $('#resultList .className').html();

Answer 3

jQuery的：

$('#resultList .stdAddress')

恕我直言，如果您需要做很多DOM选择，请继续使用jQuery

Answer 4

在jQuery中，您的代码将如下所示：

$("#resultList .stdAddress").each(function() {
    var stLine1 = $.trim($(this).children(".address1").text());
    var city = $.trim($(this).children(".city").text());
    var state = $.trim($(this).children(".state").text());
});

Answer 5

如果你想使用jquery，那就试试这个：

     $("[id*='result-list']").find("p[class*='std-address']").each(function () {
        var address = $(this).children("span[class*=address1]").html();
        var city = $(this).children("span[class*=city]").html();
        var state = $(this).children("span[class*=state]").html();

    });

见这里：http://jsfiddle.net/H3HRN/20/

为IE 8及更低版本替换getElementsByClassName

5 个答案: