Замена только текста в HTML коде

217
27 октября 2018, 14:20

К примеру, есть HTML код:

<div class="w1 pa" style="top:0;padding:5px 15px;text-align:center;">
<a id="connect" href="#" class="action yes et2">Получить список доменов</a>
<a id="delete_all" href="#" class="action no et2 f_r">Удалить все</a>
<a id="count_all" href="#" class="action save et2">Посчитать все письма</a>
<a id="filter" href="#" class="action save et2">Фильтровать</a>
</div>

Во-первых, текст внутри кода может быть любой: русский, английский, знаки, цифры и т.п.
Во-вторых, данный HTML код будет в переменной JS.

Значит, мне нужно заменить все буквы в данном HTML коде на то, что я сам захочу. К примеру, все буквы А заменить на <span>1</span>, и так далее...

Важно! Код HTML может быть другой, а не статический. Нужен скрипт, который будет искать в коде буквы, заменять выбранную мною букву на совершенно другое.

Answer 1

Так ведь можно и JavaScript изучить, пока ваши задачки порешаешь)) JS only.

var Str = '<div class="w1 pa" style="top:0;padding:5px 15px;text-align:center;">\ 
<a id="connect" href="#" class="action yes et2">Получить список доменов</a>\ 
<a id="delete_all" href="#" class="action no et2 f_r">Удалить все</a>\ 
<a id="count_all" href="#" class="action save et2">Посчитать все письма</a>\ 
<a id="filter" href="#" class="action save et2">Фильтровать</a>\ 
</div>'; 
 
function fAccurateReplace(sSourceStr, rExp, sSubstr) { 
   
  var oFakeElement = document.createElement('PRE'); 
  oFakeElement.insertAdjacentHTML('afterbegin', sSourceStr); 
   
  var treeWalker = document.createTreeWalker(oFakeElement, NodeFilter.SHOW_TEXT, null, false); 
  while (treeWalker.nextNode()) { 
    treeWalker.currentNode.parentElement.innerText = treeWalker.currentNode.parentElement.textContent.replace(rExp, sSubstr); 
  } 
  return oFakeElement.innerHTML 
} 
 
console.log(fAccurateReplace(Str, /(о.*?т)/gi, '(ЗАМЕНА)'));

Answer 2

Хотелось бы услышать что именно с каждой буквой должно быть и зачем.
Так же, ни чего нет про входные данные.

Например, в моём решении, пусть входные данные это массив определённых строк

const str = `<div class="w1 pa" style="top:0;padding:5px 15px;text-align:center;"> 
<a id="connect" href="#" class="action yes et2">Получить список доменов</a> 
<a id="delete_all" href="#" class="action no et2 f_r">Удалить все</a> 
<a id="count_all" href="#" class="action save et2">Посчитать все письма</a> 
<a id="filter" href="#" class="action save et2">Фильтровать</a> 
</div>`; 
var data = [ 
	'Список доменов получен', 
	'Всё давно удалено', 
	'Письма подсчитаны', 
	'Отфильтрованы' 
]; 
function replaceMath(data) { 
	let $newStr = $(str).clone(), 
		i = 0; 
	$("> *", $newStr).each(function(){ 
		$(this).text(data[i]); 
		++i; 
	}); 
	return $newStr.prop('outerHTML'); 
} 
 
var newStr = replaceMath(data); 
console.log(newStr);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Но, скорее всего, ни это нужно топикстартеру. Расписывайте всё подробно, а не в куче, как в ваших последних трёх предложениях.

Answer 3

С помощью jquery - $('#el_id').text('Some English ');

READ ALSO
Не работает передача параметра из url в getter. Vue js

Не работает передача параметра из url в getter. Vue js

Всем привет! Не работает передача параметра из переменной в геттер шины vue js

164
Почему не редактируется объект?

Почему не редактируется объект?

Я хочу отредактировать контакт, но после подтверждения, получаю ошибку:

182