Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 31.03.2012, 23:46
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Функция evalHTML может кому надо.
Функция выполняет роль обычного setter'а в innerHTML но при этом выполняет скрипты найденные в HTML.

Функция мало кому нужная, но тут попросили написать такую хрень, вот и написал. Если кому надо используйте. Ах да, она еще может работать как jQuery плагин, тоесть если у вас подключен jQuery то можно вызывать ее через jQuery.

var evalHTML = (function(){

	var fn = function( elem, str ) {

		str = str || elem;

		var stack = [], result;
		str = str.replace( /<script(?:[^>]*src="([^"]+)")?[^>]*>([\s\S]*?)<\/script>/gi, function( all, src, scriptText ) {
			stack[ stack.length ] = src ? { src: src } : { script: scriptText };
			return "";
		});

		if ( window.jQuery && this instanceof jQuery ) {
			result = this.html( str );
		} else {
			elem.innerHTML = str;
		}

		for( var i = 0; i < stack.length; i++ ) {

			if ( stack[ i ].src ) {

				var l, script, exists = false,
					head = document.getElementsByTagName( 'head' )[ 0 ],
					scripts = document.getElementsByTagName( 'script' );

				for( l = 0; script = scripts[ l++ ]; ) {
					if ( script.src.indexOf( stack[ i ].src ) != -1 ) {
						exists = true;
						break;
					}
				}

				if ( !exists ) {
					script = document.createElement('script');
					script.src = stack[ i ].src;
					script.type = "text/javascript";
					head.appendChild( script );
				}

			} else {
				( window.execScript || function( data ) {
					window[ "eval" ].call( window, data );
				} )( stack[ i ].script );
			}
		}

		return result;
	}

	if ( window.jQuery ) {
		jQuery.fn.evalHTML = fn;
	}

	return fn;
})();

пример без jQuery:
<div id="view"></div>
<script type="text/javascript">
var evalHTML = (function(){

	var fn = function( elem, str ) {

		str = str || elem;

		var stack = [], result;
		str = str.replace( /<script(?:[^>]*src="([^"]+)")?[^>]*>([\s\S]*?)<\/script>/gi, function( all, src, scriptText ) {
			stack[ stack.length ] = src ? { src: src } : { script: scriptText };
			return "";
		});

		if ( window.jQuery && this instanceof jQuery ) {
			result = this.html( str );
		} else {
			elem.innerHTML = str;
		}

		for( var i = 0; i < stack.length; i++ ) {
			if ( stack[ i ].src ) {
				var head = document.getElementsByTagName( 'head' )[ 0 ],
					script = document.createElement('script');
				script.src = stack[ i ].src;
				script.type = "text/javascript";
				head.appendChild( script );
			} else {
				( window.execScript || function( data ) {
					window[ "eval" ].call( window, data );
				} )( stack[ i ].script );
			}
		}

		return result;
	}

	if ( window.jQuery ) {
		jQuery.fn.evalHTML = fn;
	}

	return fn;
})();

var html = "<b>Жирный текст<script>alert('а я алерт который динамично вставили.');<"+"/script></b>";
evalHTML( document.getElementById( 'view' ), html );

</script>

пример c jQuery:
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<div id="view"></div>
<script type="text/javascript">
var evalHTML = (function(){

	var fn = function( elem, str ) {

		str = str || elem;

		var stack = [], result;
		str = str.replace( /<script(?:[^>]*src="([^"]+)")?[^>]*>([\s\S]*?)<\/script>/gi, function( all, src, scriptText ) {
			stack[ stack.length ] = src ? { src: src } : { script: scriptText };
			return "";
		});

		if ( window.jQuery && this instanceof jQuery ) {
			result = this.html( str );
		} else {
			elem.innerHTML = str;
		}

		for( var i = 0; i < stack.length; i++ ) {
			if ( stack[ i ].src ) {
				var head = document.getElementsByTagName( 'head' )[ 0 ],
					script = document.createElement('script');
				script.src = stack[ i ].src;
				script.type = "text/javascript";
				head.appendChild( script );
			} else {
				( window.execScript || function( data ) {
					window[ "eval" ].call( window, data );
				} )( stack[ i ].script );
			}
		}

		return result;
	}

	if ( window.jQuery ) {
		jQuery.fn.evalHTML = fn;
	}

	return fn;
})();

var html = "<b>Жирный текст<script>alert('а я алерт который динамично вставили.');<"+"/script></b>";

$( "#view" ).evalHTML( html );

</script>
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine

Последний раз редактировалось devote, 12.05.2012 в 19:34.
Ответить с цитированием
  #2 (permalink)  
Старый 01.04.2012, 12:13
Интересующийся
Отправить личное сообщение для denis_orlov Посмотреть профиль Найти все сообщения от denis_orlov
 
Регистрация: 06.12.2011
Сообщений: 22

мне надо!
беру две!
спасибо.
Ответить с цитированием
  #3 (permalink)  
Старый 01.04.2012, 13:03
Профессор
Отправить личное сообщение для Sweet Посмотреть профиль Найти все сообщения от Sweet
 
Регистрация: 16.03.2010
Сообщений: 1,618

jQuery и так это умеет:
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<div id="view"></div>
<script>
var html = "<b>Жирный текст<script>alert('а я алерт который динамично вставили.');<"+"/script></b>";

$( "#view" ).html( html );
</script>
Ответить с цитированием
  #4 (permalink)  
Старый 01.04.2012, 13:24
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote Посмотреть сообщение
Функция выполняет роль обычного setter'а в innerHTML но при этом выполняет скрипты найденные в HTML.

Функция мало кому нужная, но тут попросили написать такую хрень, вот и написал. Если кому надо используйте. Ах да, она еще может работать как jQuery плагин, тоесть если у вас подключен jQuery то можно вызывать ее через jQuery.

} else {
				( window.execScript || function( data ) {
					*!*window[ "eval" ].call( window, data );*/!*
				} )( stack[ i ].script );
			}
		}
BAD. Используйте new Function вместо eval, или это :

<body>.....</body>

<script>
var evalString = " document.write('Hello WORLD !!!') ";

var s = document.createElement('script');
s.innerHTML = evalString;
document.body.appendChild(s);
</script>
Ответить с цитированием
  #5 (permalink)  
Старый 01.04.2012, 14:14
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
BAD. Используйте new Function вместо eval, или это :
new Function каким способом выполнить в глобальном пространстве? тоесть скрипты то должны в глобалке выполняться...

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

P.S. Функцию писал не для себя, мне честно говоря все-равно как она евалит.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #6 (permalink)  
Старый 01.04.2012, 17:46
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от devote Посмотреть сообщение
new Function каким способом выполнить в глобальном пространстве? тоесть скрипты то должны в глобалке выполняться...

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

P.S. Функцию писал не для себя, мне честно говоря все-равно как она евалит.
Ну, раз все согласились его избегать, значит, стоит его избегать. дело вкуса
Ответить с цитированием
  #7 (permalink)  
Старый 01.04.2012, 18:34
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от melky
Ну, раз все согласились его избегать, значит, стоит его избегать. дело вкуса
согласились избегать где? на серверных приложениях да избегают все, в том числе и я. Ибо на сервере можно инъекцию сделать в случае евала. И конечно же навредить серверным данным. На стороне клиента евал опасен так же как и alert. То-есть нанести ущерб клиенту на компе не реально.

melky, боюсь вы не совсем точно информацию прочли о проблемах с евалом.
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #8 (permalink)  
Старый 13.05.2012, 02:33
Аватар для FINoM
Новичок
Отправить личное сообщение для FINoM Посмотреть профиль Найти все сообщения от FINoM
 
Регистрация: 05.09.2010
Сообщений: 2,298

Сообщение от devote
window[ "eval" ].call( window, data );
А почему не просто eval(data)? Ну или хотя-бы window.eval.call(window,data), почему eval — строка?
__________________
"Matreshka is fucking awesome" © чувак с Reddit
Matreshka.js - Три возможности
Ответить с цитированием
  #9 (permalink)  
Старый 13.05.2012, 04:09
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

Сообщение от FINoM
А почему не просто eval(data)? Ну или хотя-бы window.eval.call(window,data), почему eval — строка?
а черт их знает, я этот кусок кода из джуквери выдрал... Для чего они там так сделали это их надо спросить
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine
Ответить с цитированием
  #10 (permalink)  
Старый 13.05.2012, 10:01
Аватар для vadim5june
Студент
Отправить личное сообщение для vadim5june Посмотреть профиль Найти все сообщения от vadim5june
 
Регистрация: 30.04.2012
Сообщений: 1,113

Сообщение от Sweet Посмотреть сообщение
jQuery и так это умеет:
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<div id="view"></div>
<script>
var html = "<b>Жирный текст<script>alert('а я алерт который динамично вставили.');<"+"/script></b>";

$( "#view" ).html( html );
</script>
Что то странное у меня происходит с этим примером-беру меняю id на любое другое и script не выполняется-только html вставляется
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск