Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Задача получить родителя скрипта. (https://javascript.ru/forum/misc/52313-zadacha-poluchit-roditelya-skripta.html)

mpak 13.12.2014 05:38

Задача получить родителя скрипта.
 
Есть необходимость привязать методы к элементу в котором расположен скрипт. Некоторое время уже пытался такое написать но скрипт все еще не работает. Сложности тут вот какие. Так как jQuery начинает работать после полной загрузке всего в нутри его не получится выбрать номер нашего текущего скрипта. Это нужно делать в яваскрипте на этапе загрузки. Но потом как то полученный параметр нужно передать в сам жквери. Можно было бы использовать для этого какой то из общедоступных элементов, но какой опять же проблема. Думаю как то так делать.

<div> <!-- К этому элементу нужно прикрепить все мои события -->
	<script>
		$(function(){
			$("body").data("script").parent().on("click", "a", function(){
				alert("Клик");
			});
		}).find("body").data("script", $(document.scripts[document.scripts.length-1]))
	</script>
	<a>Нажимаем</a>
</div>

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

Я думал как то так сделать но у меня такая схема не заработала, может кто подскажет что делаю не правильно. Это был бы наверно идеальный вариант. Но заработать у меня ему не удалось. Что поменять сам плохо представляю.

<div> <!-- К этому элементу нужно прикрепить все мои события -->
	<script>
		(function($, script){
			$(script).parent().on("click", "a", function(){
				alert("Клик");
			});
		})(jQuery, document.scripts[document.scripts.length-1])
	</script>
</div>

jsnb 13.12.2014 10:15

Месье знает толк... Последний код рабочий, но в диве нет тега "a".

mpak 13.12.2014 18:32

Цитата:

Сообщение от jsnb (Сообщение 346276)
Месье знает толк... Последний код рабочий, но в диве нет тега "a".

Последний код я не смог запустить Проверьте правильно он работает но не верно. Я так понимаю в нем всетаки что то не так.

mpak 13.12.2014 18:42

Цитата:

Сообщение от jsnb (Сообщение 346276)
Месье знает толк... Последний код рабочий, но в диве нет тега "a".

Проверил действительно все работает. В прошлый раз скрипт такой ловил какие то глюки от которых не получалось избавится. Сейчас вроде все нормально. Спасибо подсказали.

Для себя удобство подобной схемы обьясняю так. Мы рабоатет с элементами. Их вложенность постоянно учитывается в DOM дереве элементов. Так чем скрипт отличается от остальных? Плюс сама практика вешать события не на каждый элемент по отдельности а одно событие на родительский элемент также становится хорошей практикой. Так почему бы не иметь возможность просто закинуть скрипт в нужный элемент. Все события сами повиснут на тег в который мы закинули скрипт. Перевесить все события на элемент выше или ниже становится делом секунд. Никакие идентификаторы в скрипте кроме место его расположения не используется. Очень удобно.

bes 14.12.2014 00:32

Цитата:

Сообщение от mpak
Для себя удобство подобной схемы обьясняю так. Мы рабоатет с элементами. Их вложенность постоянно учитывается в DOM дереве элементов. Так чем скрипт отличается от остальных? Плюс сама практика вешать события не на каждый элемент по отдельности а одно событие на родительский элемент также становится хорошей практикой. Так почему бы не иметь возможность просто закинуть скрипт в нужный элемент. Все события сами повиснут на тег в который мы закинули скрипт. Перевесить все события на элемент выше или ниже становится делом секунд. Никакие идентификаторы в скрипте кроме место его расположения не используется. Очень удобно.

делегирование событий не становится, а давно практикуется ;)
всё это сомнительно хорошо, пока не начнёшь модернизировать html ;)
и ладно, если ты сам, а не для тебя :D

рони 14.12.2014 02:50

:write:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<div> <!-- К этому элементу нужно прикрепить все мои события -->
	<script>
			$("script:last").parent().on("click", "a", function(){
				alert("Клик 1");
			});
	</script>
	<a>Нажимаем</a>
</div>
<div> <!-- К этому элементу нужно прикрепить все мои события -->
	<script>
			$("script:last").parent().on("click", "a", function(){
				alert("Клик 2");
			});
	</script>
	<a>Нажимаем</a>
</div>

ruslan_mart 14.12.2014 10:18

Вы меня конечно извините, но по моему это говнокодинг. Лучше уж вешать события через HTML-атрибуты, вызывая тем самым нужную ф-цию.

mpak 15.12.2014 00:06

Будьте добры обьяснить свой наезд с говнокодом. Лично мое мнение противоположное. Чем больше навешивается классов и идентификаторов, тем более атрибутов не по случаю тем больше это считаю говнокодом. Каждый, кто работает не разбирается почему висит тот или иной атрибут. Каждый предпочитает повесить свой. В итоге это превращается в месиво каждый из классов которых боишься убрать так как может что нибудь отвалиться. Говнокод это навешиваение на элемент не нужных идентификаторов. Зачем они если можно обойтись без них?.

Всегда считал функцию

$(function(){
})

Обязательной. Читал, что это связано выполнением скрипта, что он должен выполняться после прогрузки всех элементов. А в коде выше jQuery код не обернут и тем самым выполняется по мере загрузки страницы. Есть какая нибудь принципиальная разница с оберткой или без?

рони 15.12.2014 01:40

Цитата:

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

если вы не ответили в своём вопросе на ваш вопрос, то прочитайте ещё раз.
коду нужно не все элементы а те с которыми этот код работает ... поэтому в jquery решили лучше подождать пока все загрузятся, чтобы наверняка был элемент с которым кодер, хотел поработать, но хитрый кодер, наверняка сможет навесить функцию на несуществующий элемент, чтоб потом возмущаться почему ничего не работает :write:

jsnb 15.12.2014 03:02

Цитата:

Сообщение от mpak
Никакие идентификаторы в скрипте кроме место его расположения не используется. Очень удобно.

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

mpak 15.12.2014 11:42

Если мы работаем с одним элементом. Мы все события вешаем только на один элемент. На родителя скрипта. То все остальные нам просто не к чему. Это уже дело самого скрипта. Привязка нужна только чтобы найти один единственный родительский элемент. На мой взгляд очень просто.

Крстати нашел тот глюк о котором упоминал в начала.

Вот в таком скрипте

<div>
	<script>
		(function($, script){
			$(script).parent().on("click", "a", function(e){
				var name = $(e.currentTarget).text();
				alert(name);
			}).each(function(n, main){
				console.log("main.outerHTML:", main.outerHTML);
			});
		})(jQuery, document.scripts[document.scripts.length-1])
	</script>
	<a href="">Клик</a>
</div>


main.outerHTML почему то нет содержимого ссылки. Блок просто пустой. Это также проявляется при поиске. Элементы просто не находятся. А мне они нужны при обработке. Изменить их при загружке. Кто знает почему?

Странно. Здесь почему то выводит. Вот страница на которой пробую то же самое сделать и в ней нет содержимого. https://tiggy.ru/blockchain:test в ней нет ссылки <a href="">Клик</a> хотя она физически есть в блоке. Об этом глюке я говорил выше. Здесь можно посмотреть без шаблона то же самое https://tiggy.ru/blockchain:test/null на странице есть ссылка, а в выводе main.outerHTML ее нет.

mpak 15.12.2014 11:57

Это всетаки как то связано с загрузкой. При добавлении setTimeout все отобразилось. Хотя по логике сам jquery в обертке и должен загружаться уже после того, как все элементы прогружены. Получается, что даже с оберткой есть моменты, когда элементы прогружаются не полностью. Как в данном случае. Если загружать с интервалом или по нажатию, то все нормально. Как это можно обойти?

Как то так было бы отлично. Но опять же что то не работает.

<div>
	<script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
	<script>
		(function($, script){
			$(script).parent().on("click", "a", function(e){
				var name = $(e.currentTarget).text();
				alert(name);
			}).one("load", function(e){
				console.log("main.outerHTML:", $(e.currentTarget).get(0).outerHTML);
				setTimeout(function(){
					console.info("main.outerHTML setTimeout:", $(e.currentTarget).get(0).outerHTML);
				}, 100);
			});
		})(jQuery, document.scripts[document.scripts.length-1])
	</script>
	<a href="">Клик</a>
</div>


Событие }).one("DOMNodeInserted", function(e){ также не срабатывает.

Такой вариант }).one(function(e){ тоже не работает.

рони 15.12.2014 12:33

mpak,
какой load и e.currentTarget в load вы ждёте ??

рони 15.12.2014 12:34

mpak,
что хоть хочешь в коде сделать , что у тебя не работает?

рони 15.12.2014 12:38

Цитата:

Сообщение от mpak
main.outerHTML почему то нет содержимого ссылки

а с чего она должна быть если парсер в див только скрипт ещё вставил а до ссылки не добрался

mpak 15.12.2014 12:40

События click вешаются отлично. Это все заработало. Но нужно событие которое сработает после загрузки так как выше я написал что если сразу делать через each то элемент еще не прогрузился и в нем нет ничего посмотреть можно здесь https://tiggy.ru/blockchain:test/null первый вывод main.outerHTML: не содержит ничего, так как в элементе ничего нет поэтому и нужно событие, при котором прогрузится элемент и можно будет работать с его содержимым.

MallSerg 15.12.2014 13:46

Для начала тебе самому нужно разобраться в том чего же ты хочешь добиться.
т.е. на отдельном листке бумаги нарисуй небольшую схемку что и в какой последовательности загружается что в этом момент запускается и что и после чего должно запустится =)


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