jQuery遍历对象

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery遍历对象相关的知识，希望对你有一定的参考价值。

一个jQuery对象name:"abc",type:"p",......,如何遍历这个对象？

<script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
<pre>
<script>
var obj=name:"abc",type:"p";
$.each(obj,function(k,v)
    //这里是处理 obj 的函数
    document.writeln(k+':'+v);
)
//$.each($("div"),function(k,v))
//$("div").each(function(index, element)  );
//我知道的就这两种用法
</script>
</pre>

 参考技术A $(document).ready(function()
    var obj = name:"abc",type:"p";
    $.each(obj, function(k, v)
        alert("k=" + k);
        alert("v=" + v);
    );
);

 参考技术B 这又不是数组或集合怎么遍历？取对象属性值 么？var name = obj.name 或 obj["name"] 是要这样效果么。 如果是数组对象 jquery 可以 obj.each(function()

var name = this.name;
) 参考技术C 原生js就可以啊
var demo = name:"abc", type:"p";
for (var i in demo) alert(i + ':' + demo[i]);本回答被提问者采纳

为啥我不能使用 iframe 对象和 jQuery 遍历这个元素？

【中文标题】为啥我不能使用 iframe 对象和 jQuery 遍历这个元素？【英文标题】：Why can't I traverse this element using iframe object and jQuery?为什么我不能使用 iframe 对象和 jQuery 遍历这个元素？ 【发布时间】：2017-05-23 12:16:31 【问题描述】：

我正在尝试使用 iframe 对象 和 jQuery 访问特定元素（可能更类似于此），但它不起作用。

iframeWindow 对象是not null，但下一条语句似乎不起作用。我在这个答案上看到了类似this 的东西，但它不起作用。我做错了吗？

这是我的代码：

RADIO.PHP

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="jquery.js"></script>
    <script>

        $(document).ready(function()
            setTimeout(function()
            var iframe= document.getElementById("iframe");
            var iframeWindow = iframe.contentWindow;
            var text=iframeWindow.$("div:nth-child(3) .c2").html();
            console.log(text);

            //DOESN'T PRINT "INNER MOST"

        , 1000);

    );
    </script>
</head>
<body>
  <div class="c1">
  <iframe id="iframe" src="api.php"  >
  </iframe>
  </div>
</body>
</html>

API.PHP

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<script type="text/javascript" src="jquery.js"></script>
<body id="abody">
Hey
    <div class="c1"></div>
    <div class="c1">
        <p class="c2"></p>
    </div>
    <div class="c1">
        <p class="c2">
         INNER MOST
        </p>
    </div>
</body>
</html>

编辑：我已经纠正了语法错误。

【问题讨论】：

请注意，您的 HTML 无效。您不能将 p 元素相互嵌套，因此 DOM 结构与您的选择器不匹配 我已经编辑了请检查一下 iframeWindow !== inframeWindow 也检查一下这个。 【参考方案1】：

您应该使用iframe.contentWindow.document 而不是iframe.contentWindow 与find() 和text() 结合使用，它应该可以工作。试试这个：

$(document).ready(function() 
  setTimeout(function() 
    var iframe = document.getElementById("iframe");
    var iframeWindow = iframe.contentWindow.document;
    var text = $(iframeWindow).find(".c1:nth-child(3) .c2").text();
    console.log(text);

    //PRINTS "INNER MOST"

  , 1000);

);

根据 MDN 文档说：

contentWindow 属性返回 iframe 元素的 Window 对象。您可以使用此 Window 对象来访问 iframe 的 document 及其内部 DOM。该属性是只读的，但它的属性可以像全局 Window 对象一样进行操作。

您可以阅读有关 iframe 元素及其工作原理的更多信息here。

【讨论】：

【参考方案2】：

要在 jQuery 中为选择器指定范围，请将范围作为第二个参数传递给 jQuery 选择器。

替换：

inframeWindow.$("div:nth-child(3) p .c2")

与

$("div:nth-child(3) p .c2", inframeWindow)

（另外，DOM 或 jQuery 对象上没有 $ 成员函数。）

【讨论】：

他也应该把inframeWindow改成iframeWindow。 对不起，它只是显示未定义。我无法使用 .text() 获取文本 @Richard 你有什么参考吗？它只是行不通。 @ShankySharma：什么显示未定义？你纠正错字了吗：inframeWindow vs iframeWindow？ @VikasKumar：是的。注意，。如果您有类似但不完全相同的问题，您应该创建自己的问题。评论不是交互式诊断的好地方。【参考方案3】：

很明显，我和所有其他人都错过了错字，而不是应该是 iframeWindow 的 inframeWindow。

尝试使用 jquery 选择器：

var text=$(iframeWindow).find("div:nth-child(3) .c2").html();

您正在将 jquery 方法附加到 DOM 对象。这不能以这种方式完成。您必须将其设为 jQuery 对象才能分配 jQuery 方法。

【讨论】：

他也应该把inframeWindow改成iframeWindow。 对不起，它只是显示未定义。我无法使用 .text() 获取文本【参考方案4】：

试试这个方法希望对你有帮助

更新答案

var $iframe= $("#iframe");
var $iframeWindow = $iframe.contents();
var text=$iframeWindow.find("div").eq(2).find('p .c2').html();
console.log(text);

【讨论】：

对不起，它只是显示未定义。我无法使用 .text() 获取文本

以上是关于jQuery遍历对象的主要内容，如果未能解决你的问题，请参考以下文章

jquery对象的遍历(显示遍历隐式遍历)

jQuery遍历对象/数组/集合

jQuery ---[jQuery选择器,jQuery对象的遍历]

jQuery 使用 $.each 遍历对象

jQuery 循环遍历 data() 对象

如何在 jQuery 中遍历这个 JSON 对象？