Как преобразовать тексты li в ссылки в javascript случайным образом?

Ncxetrcdo

Мне нужно преобразовать список текстов li в ссылки с помощью javascript, 3 ссылки случайным образом.

ИЗ ЭТОГО:

 <div class="mytd">
<ul>
<li> list 1</li>
<li> list 2</li>
<li> list 3</li>
<li> list 4</li>
<li> list ..</li>
<li> list 99 </li>
<li> list 100</li>
</li>

</div>

 <!-- CONVERT TO LINKS -->
 <script type="text/javascript">
 function getElementsByClass (className) {
 var all = document.all ? document.all :
 document.getElementsByTagName('*');
 var elements = new Array();
 for (var i = 0; i < all.length; i++)
 if (all[I].className == className)
 elements[elements.length] = all[I];
 return elements;
 }
 function makeLinks(className, url) {
 nodes = getElementsByClass(className);
 for(var i = 0; i < nodes.length; i++) {
 node = nodes[I];
 text = node.innerHTML
 node.innerHTML = '<a href="' + url + text.toLowerCase().replace(/\bamp\b|[^A-Z0-9]+/ig, "-") + '">' + text + '</a>';
 }}
</script>

<!-- CONVERT TO LINKS -->
<script type="text/javascript">
 makeLinks("mytd", "mywebsite.com/folder/");
</script>

Код (разметка): К ЭТОМУ:

 <div class="mytd"> <ul> <li> list 1</li> <li> <a href="/folder/"> list 2 </a> list 2</a></li> <li> list 3</li> <li> list 4</li> <li> list ..</li> <li> <a href="/folder/"> list 80 </a> list 80</a></li> <li> <a href="/folder/"> list 82 </a> list 82</a></li> <li> list 100</li> </li> </div>

Код (разметка): Я везде выполняю поиск по переполнению стека, но не могу найти ничего, что соответствует моим потребностям.

Что-то вроде этого:

 <ul> <li> list 1</li> <li> list 2</li> <li> list 3</li> <li> list 4</li> <li> list ..</li> <li> list 80 </li> <li> list 82 </li> <li> list 100</li> </li>

Код (разметка):

Tstert

Абсолютно!!! И почему нужно делать это случайным образом? Это будет мешать SEO и вашим посетителям: «Эй, Брэд, посмотри на это, черт возьми, это была ссылка в прошлый раз, интересно, почему меня заблокировали?»

Lord_Prime

1) Разве это не должно быть сделано НА СЕРВЕРНОЙ СТОРОНЕ?

2) Барбара Уолтерс, не 2003 год, можешь перестать говорить type="text/JavaScript"

3) если вам ДЕЙСТВИТЕЛЬНО не нужна поддержка IE6/более ранних версий, вам не нужно создавать запутанный беспорядок с полифилом для getElementsByClassName, он существует.

4) Опять же, в случае с Бабавой Вавой, InternalHTML — это пережиток, использования которого следует избегать.

Это называется DOM, используйте его. 5) в вашей разметке нет классов, которыми можно было бы манипулировать, или идентификатора, по которому можно было бы ее перехватить. 6) Якорь в вашем преобразовании — это ерунда, поскольку вы закрываете дважды, и все они имеют один и тот же URI.

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

Сначала давайте сделаем некоторую разметку, которую мы сможем перехватить.

 
function makeLinks(parentClass, uri) {
for (
var
i = 0,
matchedLi = document.querySelectorAll('.' + parentClass + ' li'),
li, a, text;
li = matchedLi[i];
i++
) {
a = li.appendChild(document.createElement('a'));
a.href = uri + li.textContent.toLowerCase().trim().replace(/[\W]+/g, '-');
a.appendChild(document.createTextNode(li.textContent));
while (a.previousSibling) li.removeChild(a.previousSibling);
}
}

makeLinks('randomLinks', 'folder/');

Код (разметка): сначала давайте создадим версию, которая преобразует их все в ссылки.

  <ul class="randomLinks"> <li>list 1</li> <li>list 2</li> <li>list 3</li> <li>list 4</li> <li>list ..</li> <li>list 80 </li> <li>list 82 </li> <li>list 100</li> </ul>

Код (разметка): После этого вам не составит труда рандомизировать выполнение только трех из них.

Создайте привязку как элемент DOM, прикрепите ее, установите атрибуты и удалите существующие узлы DOM, используя обход DOM, что в целом быстрее, менее подвержено проблемам и не создает рисков безопасности, связанных с написанием дерпи "innerHTML" - что-то что ИМХО никогда не должно было быть частью JavaScript.

или, по крайней мере, не для записи в "живой" DOM.

Похожие темы	Дата
Школа Программирования. Javascript	19.12.2024, 05:12
[WebForMySelf] JavaScript. Полное руководство для современной веб-разработки (2019)	19.12.2024, 05:12
[Школа современных технологий] Среда знаний. Основы JQuery. Дмитрий Лаврик [01.04.2015]	19.12.2024, 05:12
Slider Revolution Responsive Jquery Plugin 5.2.4	19.12.2024, 05:12
[luxoft] Практическая Разработка Веб-приложений На Javascript И Angularjs	19.12.2024, 05:12
js+php. Как сохранить настройки посетителя?	19.12.2024, 05:12
понять и улучшить размеры холста Михуса	19.12.2024, 05:12
Решение для сбора платежей из приложения Ionic Mobile	19.12.2024, 05:12
CanvasJS – обновление параметра URL ИЛИ при изменении формы selectmenuchange	19.12.2024, 05:12
Отладка проблемы перезагрузки страницы	19.12.2024, 05:12

Как преобразовать тексты li в ссылки в javascript случайным образом?

Ncxetrcdo

Tstert

Lord_Prime

I AM

Интересно