Замените атрибут SRC на TITLE в теге LI
У меня есть HTML-код, приведенный ниже:
<ul id = "thumbsPhotos">
<li src = "/images/1alvaston-hall-relaxing-lg.jpg" onclick = "updatePhoto (this.title)"><img src = "/images/1alvaston-hall-relaxing-sl.jpg" width = "56" height = "56"></li>
<li onclick = "updatePhoto(this.title)" src = ""><img src = "" width = "56" height = "56"></li>
<li onclick = "updatePhoto(this.title)" src = ""><img src = "" width = "56" height = "56"></li>
</ul>
Теперь я хочу заменить все src в тегах <li>, а не в тегах <img>, используя InnerHTML. При этом мой результат будет:
<ul id = "thumbsPhotos">
<li title = "/images/1alvaston-hall-relaxing-lg.jpg" onclick = "updatePhoto(this.title)"><img src = "/images/1alvaston-hall-relaxing-sl.jpg" width = "56" height = "56"></li>
<li onclick = "updatePhoto(this.title)" title = ""><img src = "" width = "56" height = "56"></li>
<li onclick = "updatePhoto(this.title)" title = ""><img src = "" width = "56" height = "56"></li>
</ul>
нет, я думаю, он хочет изменить свой вывод так, чтобы атрибут «src» LI теперь стал атрибутом «title».
нет У меня есть атрибут src в <li> (пожалуйста, проверьте первый html), я просто хочу заменить все атрибуты src на "title" (пожалуйста, проверьте второй html)
сделано на стороне сервера, верно?
Я не понимаю, зачем вообще нужны теги src в <li>?
"using InnerHTML" означает, что вы хотите, чтобы это происходило "внутри" браузера с использованием javascript? И почему это должен быть innerHtml? ... и почему вообще есть атрибут src? ;)
Редакторы: быстрое нарушение кодировки тегов !!!!
вау: было около 4 правок с разницей в минуту ... / я снова иду редактировать ...
Что вы имеете в виду под "внутренним HTML"? Некоторые из ваших комментариев ниже кажутся противоречивыми, и вы вообще ничего не объясняете.
Я думаю, это домашнее задание.
@ chris-marasti-georg: То же самое. ОП очень уклончиво.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 4
Скорее всего, вы можете использовать замену RegEx, которая соответствует атрибуту src, и выполнить преобразование. Я вижу, что вы также хотите добавить атрибут title, даже если совпадения нет, это тоже должно быть возможно.
Я попытаюсь найти для этого несколько примеров RegEx.
Не ответ, но это не очень семантический способ делать что-то. Откуда это взялось? Почему в элементе li вообще есть src?
Предполагая, что вам нужна опция javascript, вы можете использовать что-то вроде jquery:
$(document).ready(function() {
$("li[src], li[src='']").each(function() {
var li = $(this);
li.attr("title", li.attr("src"));
li.removeAttr("src");
});
});
возможно ли это с использованием innerHTML, используя регулярное выражение
В браузере? Вам все еще нужно запустить какой-то javascript. Почему вы закрываете себя для этого решения? Это проблема с домашним заданием?
в основном мне нужно изменить этот "src" на "title" во время выполнения страницы
Ну, код, который у меня там есть, сделает это. Вы можете разместить библиотеку jquery или сделать ссылку на уменьшенную версию по адресу jqueryjs.googlecode.com/files/jquery-1.2.6.min.js. Затем просто вставьте приведенный выше код в тег скрипта.
И вы все еще не ответили на вопрос Почему, у вас есть атрибут src в теге li? Почему бы в первую очередь не создать правильный HTML?
хех - мой ответ, использующий простой javascript, на самом деле меньше кода. :)
Да, это так, и, вероятно, он должен быть выше моего :) Если парень знает, как принять ответ, так и будет.
Не проверено, но вот регулярное выражение, которое может сделать это за вас ...
// find:
<li ([^>]*)src = "(.*?)"(.*?)>
// replace:
<li $1title = "$2"$3>
Обновлять: проверено и работает на вашем примере.
Если вы хотите запустить это на стороне клиента с помощью Javascript (по какой-то странной причине), вы можете сделать это:
var ul = document.getElementById("thumbsPhotos");
ul.innerHTML = ul.innerHTML.replace(
/<li ([^>]*)src = "(.*?)"(.*?)>/g,
'<li $1title = "$2"$3>'
);
не могли бы вы дать это решение, используя innerHTML
Если вам нужно сделать это один раз, просто не найти и заменить работу?
В противном случае я согласен, что регулярное выражение - лучший вариант.
Итак, щелкнув элемент
<li>, вы хотите изменить вложенный<img>src на значение атрибута title этого<li>?