Javascript-форум - Подскажите как удалить iframe с заменой на div

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Подскажите как удалить iframe с заменой на div (https://javascript.ru/forum/misc/50888-podskazhite-kak-udalit-iframe-s-zamenojj-na-div.html)

tyshka

16.10.2014 01:56

Подскажите как удалить iframe с заменой на div

Всем привет,
подскажите как удалить все <iframe> на странице, если атрибут "src" содержит в ссылке определенное слово например "google" и заменить его на <div>

terminator-101

16.10.2014 04:45

Можешь попробовать вот так

<html>
<head>
</head>
    <body>

<iframe src="https://google.ru" num=1></iframe> <iframe src="google" num=2></iframe>
<iframe src="http://javascript.ru"></iframe>
<iframe src="https://google.com" num=3></iframe>
<div><iframe src="https://google.net" num=4></iframe></div>
<iframe src="HTTPS://GOOGLE.INFO" num=5></iframe>


<script>
(function(){
var text=document.body.innerHTML
var re=/<iframe[^>]+google[^>]+>[^>]*<\/iframe>/gi
text=text.replace(re, "<div>text here</div>")
document.body.innerHTML=text
})()
</script>
    </body>
</html>

Только протестируй хорошенько. Вариант хреновый, конечно, перерисовывается вся страница, но для однократных вызовов пойдет, если заработает. И жди, что настоящие спецы ниже подскажут:), а я нуб, прислушиваться не стоит:)

ruslan_mart

16.10.2014 05:20

(function() {
    var frames = window.frames;
    if(frames[0]) {
        var div = document.createElement('div'), i;
        div.innerHTML = 'Содержимое дива';
        for(i=0; i<frames.length; i++) {
            frames[i].parentNode.replaceChild(div, frames[i]);
        }
    }
})();

danik.js

16.10.2014 05:29

Цитата:

Сообщение от Ruslan_xDD

window.frames

Это ж вроде коллекция объектов типа Window, не?

Поиск по google: document.querySelectorAll('iframe[src*="google"]')

ruslan_mart

16.10.2014 05:32

danik.js, блин, что-то я не так походу вник.

(function() {
    var frames = document.querySelectorAll('iframe[src*="google"]');
    if(frames[0]) {
        var div = document.createElement('div'), i;
        div.innerHTML = 'Содержимое дива';
        for(i=0; i<frames.length; i++) {
            frames[i].parentNode.replaceChild(div, frames[i]);
        }
    }
})();

terminator-101

16.10.2014 05:48

Ruslan_xDD,
Я типа того тоже пробовал, че-то не работает

<html>
<head>
</head>
    <body>
<iframe src="https://google.ru" num=1></iframe> <iframe src="google" num=2></iframe>
<iframe src="http://javascript.ru"></iframe>
<iframe src="https://google.com" num=3></iframe>
<div><iframe src="https://google.net" num=4></iframe></div>
<iframe src="HTTPS://GOOGLE.INFO" num=5></iframe>
 
<script>
(function() {
    var frames = document.querySelectorAll('iframe[src*="google"]');
    if(frames[0]) {
        var div = document.createElement('div'), i;
        div.innerHTML = 'Содержимое дива';
        for(i=0; i<frames.length; i++) {
            frames[i].parentNode.replaceChild(div, frames[i]);
        }
    }
})();
</script>
    </body>
</html>

terminator-101

16.10.2014 06:01

Ruslan_xDD, и даже по точным совпадениям не работает

<html>
<head>
</head>
    <body>
<iframe src="google" num=1></iframe> <iframe src="google" num=2></iframe>
<iframe src="http://javascript.ru"></iframe>
<iframe src="google" num=3></iframe>
<div><iframe src="google" num=4></iframe></div>
<iframe src="GOOGLE" num=5></iframe>
 
<script>
(function() {
    var frames = document.querySelectorAll('iframe[src*="google"]');
    if(frames[0]) {
        var div = document.createElement('div'), i;
        div.innerHTML = 'Содержимое дива';
        for(i=0; i<frames.length; i++) {
            frames[i].parentNode.replaceChild(div, frames[i]);
        }
    }
})();
</script>
    </body>
</html>

tyshka

16.10.2014 07:03

Цитата:

Сообщение от Ruslan_xDD (Сообщение 335884)

danik.js, блин, что-то я не так походу вник.

(function() {
    var frames = document.querySelectorAll('iframe[src*="google"]');
    if(frames[0]) {
        var div = document.createElement('div'), i;
        div.innerHTML = 'Содержимое дива';
        for(i=0; i<frames.length; i++) {
            frames[i].parentNode.replaceChild(div, frames[i]);
        }
    }
})();

Спасибо, работает! А как добавить несколько классов этому div?

Пробовала так div.className( 'class_1 class_2' ) и так div.addClass( 'class_1 class_2' ) что-то не получается...

terminator-101

16.10.2014 07:27

Цитата:

Сообщение от tyshka

Спасибо, работает!

Что то я не пойму, почему у Вас работает а у меня нет? Пробовал в и опере и хроме и в ff, нигде не пашет

tyshka

16.10.2014 07:33

$(function() {
........................
});

Я вот так пробовала :)

terminator-101

16.10.2014 07:35

Цитата:

Сообщение от tyshka

Я вот так пробовала

Это наверное как-то с jquery связано? Я в нем не разбираюсь. Но, по-идее, про Jquery вроде никто не говорил ничего.

tyshka

16.10.2014 08:12

Так это же как бы форум яваскрипта, изначально предполагается что просьба о помощи будет иметь отношение к ява...

Так сейчас то у вас заработало?

danik.js

16.10.2014 08:16

Цитата:

Сообщение от tyshka

изначально предполагается что просьба о помощи будет иметь отношение к ява

Яваскрипт и jQuery - не одно и то же. Для jQuery кстати тут есть отдельный раздел.

У меня работает. Firefox 32.

tyshka

16.10.2014 08:29

Прошу прощения, я не разбираюсь...
Главное что у меня заработал предложенный вариант решения, кстати я не испортила оболочку функции поставив $ ? И все еще актуален вопрос с добавлением класса к создаваемому элементу div.
А чем будет отличатся решение задачи в квери написании от этого варианта?

tyshka

16.10.2014 08:31

Да и у меня работает в хроме и ie8 в ff не проверяла

terminator-101

16.10.2014 08:31

danik.js,

Проверь пожалуйста вот с этим примером,
http://javascript.ru/forum/misc/5088...tml#post335885

может там с кодом что-не так? Или, может быть, это работает только с айфреймами 1-го уровня вложенности только. Я чет вообще не пойму.

terminator-101

16.10.2014 08:39

danik.js,
Щас кстати заметил, что у меня там закрывающий тег скрипт не подсвечивается, там где-то что-то экранируется, возможно.

tyshka

16.10.2014 08:50

Цитата:

Сообщение от terminator-101 (Сообщение 335897)

Я же написала у меня этот вариант работает, но у меня подключена библиотека квери и я оболочку функции немного изменила (писала выше) и у меня работает

danik.js

16.10.2014 09:06

Цитата:

Сообщение от terminator-101

может там с кодом что-не так?

А, точно, не так. div то нужно в цикле создавать )
И че за странная проверка if (frames[0]) ?
Адекватно тестят так: if (frames.length > 0)

danik.js

16.10.2014 09:08

<iframe src="https://google.ru" num=1></iframe>
<iframe src="google" num=2></iframe>
<iframe src="http://javascript.ru"></iframe>
<iframe src="https://google.com" num=3></iframe>
<div><iframe src="https://google.net" num=4></iframe></div>
<iframe src="HTTPS://GOOGLE.INFO" num=5></iframe>


<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$('iframe[src*="google"]').each(function() {
    var div = $('<div/>', {'class': 'Bla bla', html: 'Содержимое дива'});
    $(this).replaceWith(div);
});
</script>

tyshka

16.10.2014 09:25

danik.js спасибо все работает, как я поняла этот вариант уже на квери

проверила в хром, опера, ff, ie8 - везде работает

всем ответившим спасибо, отдельный чмок для danik.js

ruslan_mart

16.10.2014 11:02

Цитата:

Сообщение от tyshka

div.className = 'class_1 class_2';

Часовой пояс GMT +3, время: 08:01.