<![CDATA[Серый форум — JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?id=13269 Wed, 06 Dec 2017 20:04:42 +0000 PunBB <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=122009#p122009 Ну у меня тоже частный случай, мне это надо было для одной фичи в AhkSpy, поэтому код библиотеки в общем AutoHotkey коде из-за одного пустяка на JS это слишком.
Далее оказалось что надо было это мне исключительно из за моего неправильного подхода к HTML, в итоге всё оказалось проще.
Но решение конечно интересно, если библиотеки это делают, значит оно есть, а я до него не дошёл.

]]> Wed, 06 Dec 2017 20:04:42 +0000 http://forum.script-coding.com/viewtopic.php?pid=122009#p122009 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121999#p121999 serzh82saratov, а стоит ли выдёргивать ? Если вдуматься, то отсутствие createRange у document в IE8 это частный случай его (IE) ущербности. Завтра может понадобиться реализовать тоже самое под IE6 / IE7 и т.п. А значит искать новые пути подхода. А раз так, то лучше обстоятельства подогнать под удобство, чем жертвовать удобством из-за обстоятельств. Проще говоря - 158 кб (и это ещё не minified) не особо портят картину, как мне кажется. В принципе задачу можно решить и через jQuery. Там так и вообще 86 кб кода. На то он (jQuery) и делался, чтобы облегчить момент разработки. )

]]> Wed, 06 Dec 2017 10:50:29 +0000 http://forum.script-coding.com/viewtopic.php?pid=121999#p121999 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121998#p121998 Слишком громоздко, оттуда даже выдернуть что то тяжело.

]]> Wed, 06 Dec 2017 10:13:59 +0000 http://forum.script-coding.com/viewtopic.php?pid=121998#p121998 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121996#p121996 Как вариант, можно использовать rangy


<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=IE8" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<!-- rangy "https://github.com/timdown/rangy/wiki" -->
		<script src="https://rawgit.com/timdown/rangy/master/lib/rangy-core.js"></script>
		<style>
			#Ref3, #Ref4 {color: green;}
			#Ref1, #Ref2 {color: red;}
		</style>
	</head>
	<body>
		<span id='Ref1'>content of span1 </span>нынешний код или пусто<span id='Ref3'>, ещё код </span><span id='Ref4'>, и ещё код</span><span id='Ref2'> content of span2</span>
		<button onclick="test()">replace</button>
		<script type="text/javascript">
			function test(){
				var r = rangy.createRange();
				r.setStartAfter(Ref1);
				r.setEndBefore(Ref2);
				r.deleteContents();
				r.insertNode(document.createTextNode('test'));
			}
		</script>
	</body>
</html>
]]> Wed, 06 Dec 2017 08:54:15 +0000 http://forum.script-coding.com/viewtopic.php?pid=121996#p121996 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121991#p121991 У меня ещё такой костыль, но это только если стразу после "<span id='Ref1'>content of span1 </span>" не будет пусто и будет символ но не элемент.

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=IE8" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<body>
		<p id='con'><span id='Ref1'>content of span1 </span>нынешний код или пусто<span id='Ref3'>, ещё код </span><span id='Ref4'>, и ещё код</span><span id='Ref2'> content of span2</span></p>
		<button onclick="test()">replace</button>
		
		<script type="text/javascript">
		function test(){
			var rng1 = document.body.createTextRange();
			rng1.moveToElementText(document.getElementById("Ref1"));
			
			var rng2 = document.body.createTextRange();
			rng2.moveToElementText(document.getElementById("Ref2"));
			
			alert(document.getElementById("con").innerHTML);
			
			rng1.setEndPoint("StartToStart", rng2);
			rng1.moveStart("character", 1);
			rng1.moveStart("character", -1);
			rng1.pasteHTML("New HTML");
			
			alert(document.getElementById("con").innerHTML);
		}
		</script>
	</body>
	<style>
		#Ref3, #Ref4 {color: green;}
		#Ref1, #Ref2 {color: red;}
	</style>
</html>
]]> Tue, 05 Dec 2017 22:02:50 +0000 http://forum.script-coding.com/viewtopic.php?pid=121991#p121991 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121990#p121990 У меня почему то

Объект не поддерживает свойство или метод "createRange"


На 9 работает как надо, но мне для IE8 надо.

]]> Tue, 05 Dec 2017 21:51:44 +0000 http://forum.script-coding.com/viewtopic.php?pid=121990#p121990 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121989#p121989 serzh82saratov, ах вон оно как. Тогда понятно.

Тогда наверное ещё можно так ?


function test(){
	var r = document.createRange();
	r.setStartAfter(Ref1);
	r.setEndBefore(Ref2);
	r.deleteContents();
	r.insertNode(document.createTextNode('test'));
}
]]> Tue, 05 Dec 2017 20:28:54 +0000 http://forum.script-coding.com/viewtopic.php?pid=121989#p121989 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121988#p121988 Не получится, "нынешний код" это не только текст, но и любой код.

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=IE8" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<body>
		<span id='Ref1'>content of span1 </span>нынешний код или пусто<span id='Ref3'>, ещё код </span><span id='Ref4'>, и ещё код</span><span id='Ref2'> content of span2</span>
		<button onclick="test()">replace</button>
		<script type="text/javascript">
		function test(){
			document.getElementById('Ref1').nextSibling.data = "[замена]"
		}
		</script>
	</body>
	<style>
		#Ref3, #Ref4 {color: green;}
		#Ref1, #Ref2 {color: red;}
	</style>
</html>
]]> Tue, 05 Dec 2017 20:25:29 +0000 http://forum.script-coding.com/viewtopic.php?pid=121988#p121988 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121987#p121987 Господа, прошу простить меня, если не разобрался в постановке задачи, но вроде бы можно проще ?


<!DOCTYPE html>
<html lang="en">
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=IE8" />
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	</head>
	<body>
		<span id='Ref1'>content of span1 </span>нынешний код или пусто<span id='Ref2'> content of span2</span>
		<button onclick="test()">replace</button>
		<script type="text/javascript">
		function test(){
			Ref1.nextSibling.data = "[замена]"
		}
		</script>
	</body>
</html>
]]> Tue, 05 Dec 2017 20:16:43 +0000 http://forum.script-coding.com/viewtopic.php?pid=121987#p121987 <![CDATA[Re: JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121938#p121938 Можно, например, так: 

document.onclick = function() {
	var TextRange = document.body.createTextRange();
	while (TextRange.findText("нынешний код, но не пусто (иначе будет нечего искать)")) {
		TextRange.pasteHTML('<span id="idFound">новый текст, на который будут заменены все вхождения</span>');
		TextRange.collapse(false);
	}
}

Подробности хорошо расписаны тут. Но делать так я бы не советовал. Гораздо проще (быстрее, надежнее,...) весь html текст, который предназначен для замены, заключить в теги с идентификатором id и менять его c innerHTML.

]]> Mon, 04 Dec 2017 11:24:52 +0000 http://forum.script-coding.com/viewtopic.php?pid=121938#p121938 <![CDATA[JS: pasteHTML между элементами]]> http://forum.script-coding.com/viewtopic.php?pid=121928#p121928 Хочется вставить код между элементами. Не могу понять как в IE 8 расположить TextRange именно между элементами.

Например было:

<span id='Ref1'></span>нынешний код или пусто<span id='Ref2'></span>

стало:

<span id='Ref1'></span>мой новый код или стираю старый<span id='Ref2'></span>
]]> Sun, 03 Dec 2017 20:09:47 +0000 http://forum.script-coding.com/viewtopic.php?pid=121928#p121928