Question

    <div id="OverallContainer">
            <div class="sort con drop" id="LayoutContainer1">
                <div title="LayoutContainer" class="drag" id="Layout">
                    <div class="container con" id="Layoutpanel">
                        <div class="header" data-toggle-tooltip="tooltip" title="Drag Me">
                            <div class="ctrls">
                                <div class="btn-group  pull-right">
                                    <span class="glyphicon glyphicon-chevron-down dropdown-toggle Conficons" data-toggle="dropdown" data-toggle-tooltip="tooltip" title="Menu"></span>
                                    <ul class="dropdown-menu">
                                        <li><a href="#" onclick="AddNewClick(this.title)" data-toggle="modal" title="Layoutframe">Change</a></li>
                                        <li><a href="#" onclick="RemoveClick(this.title)" title="LayoutContainer">Remove</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div id="LayoutRegion" class="dragbox-content">
                            <iframe id="Layoutframe" class="frame" scrolling="no" frameborder="0" src="www.google.com"></iframe>
                        </div>
                    </div>
                </div>
            </div>
            <div class="sort con drop" id="LayoutContainer2">
                <div title="LayoutContainer" class="drag" id="Layout">
                    <div class="container con" id="Layoutpanel">
                        <div class="header" data-toggle-tooltip="tooltip" title="Drag Me">
                            <div class="ctrls">
                                <div class="btn-group  pull-right">
                                    <span class="glyphicon glyphicon-chevron-down dropdown-toggle Conficons" data-toggle="dropdown" data-toggle-tooltip="tooltip" title="Menu"></span>
                                    <ul class="dropdown-menu">
                                        <li><a href="#" onclick="AddNewClick(this.title)" data-toggle="modal" title="Layoutframe">Change</a></li>
                                        <li><a href="#" onclick="RemoveClick(this.title)" title="LayoutContainer">Remove</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div id="LayoutRegion" class="dragbox-content">
                            <iframe id="Layoutframe" class="frame" scrolling="no" frameborder="0" src="www.google.com"></iframe>
                        </div>
                    </div>
                </div>
            </div>
<div class="sort con drop" id="LayoutContainer3">
                <div title="LayoutContainer" class="drag" id="Layout">
                    <div class="container con" id="Layoutpanel">
                        <div class="header" data-toggle-tooltip="tooltip" title="Drag Me">
                            <div class="ctrls">
                                <div class="btn-group  pull-right">
                                    <span class="glyphicon glyphicon-chevron-down dropdown-toggle Conficons" data-toggle="dropdown" data-toggle-tooltip="tooltip" title="Menu"></span>
                                    <ul class="dropdown-menu">
                                        <li><a href="#" onclick="AddNewClick(this.title)" data-toggle="modal" title="Layoutframe">Change</a></li>
                                        <li><a href="#" onclick="RemoveClick(this.title)" title="LayoutContainer">Remove</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div id="LayoutRegion" class="dragbox-content">
                            <iframe id="Layoutframe" class="frame" scrolling="no" frameborder="0" src="www.google.com"></iframe>
                        </div>
                    </div>
                </div>
            </div>
Like wise many LayoutContainers
        </div>

我动态生成＆＃34; Layoutcontainer＆＃34;内部＆＃34;整体容器＆＃34; 每个LayoutContainers都包含Iframe标签，如上面的代码，我需要提取一个＆＃34; src＆＃34;使用jquery

的所有子容器的iframe

我尝试了这个，但它重复了网址

 $('#OverallContainer > div').each(function () {
        saveUrl1 += $('#OverallContainer').find('.frame').attr('src');
        saveUrl1 += ",";
    });

和

 $('#OverallContainer > div').each(function () {
        saveUrl1 += $('#OverallContainer .frame[src]').prop('src');
        saveUrl1 += ",";
    });

Answer 1

#OverallContainer有两个div，你迭代它们然后你全球搜索所有iframe，所以即使你的iframe是一个，你要求它两次。

所以你需要使用$(this).find('iframe');所以它是iframe但是相对于你迭代的div。

这是代码：

var urls=[];
$('#OverallContainer > div').each(function () {
    var iframe = $(this).find('iframe');
    if (iframe.length) { // item exists
        urls.push(iframe.attr('src'));
    }
});
saveUrl1 = urls.join(',');

或更短：

saveUrl1 = $('#OverallContainer > div iframe').map(function() {
    return $(this).attr('src');
}).get().join(',');

Answer 2

我得到了解决方案：

$('#OverallContainer > div').each(function () {
            saveUrl1 += $(this).find("iframe").prop("src");
            saveUrl1 += ",";
        });

提取子属性

2 个答案: