Преобразуйте URL в ссылку, если ссылка еще не была - PullRequest
1 голос
/ 17 октября 2010

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

Я использую функцию для преобразования простых текстовых URL-адресов в интерактивные ссылки. Вот что у меня есть:

<script type='text/javascript' language='javascript'>

window.onload = autolink;

function autolink(text) {

var exp = /(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;

document.body.innerHTML = document.body.innerHTML.replace(exp,"<a href='$1'>$1</a>"); 

}

</script>

Это делает

https://stackoverflow.com/

выглядит как:

https://stackoverflow.com/

Работает, но также заменяет существующие ссылки HTML вложенными ссылками.

Итак, действительная HTML-ссылка, такая как

<a href="https://stackoverflow.com/">StackOverflow</a>

Становится что-то грязное, как:

<a href="https://stackoverflow.com/<a href="https://stackoverflow.com/">StackOverflow</a>">StackOverflow</a>...

Как я могу исправить выражение, чтобы игнорировать содержимое тегов ссылок? Спасибо!

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

Ответы [ 2 ]

5 голосов
/ 17 октября 2010

Используя jQuery JavaScript библиотеку , это будет выглядеть так (демонстрация на http://jsfiddle.net/BRPRH/4):

function autolink() {
    var exp = /(\b(https?|ftp):\/\/[-A-Z0-9+\u0026@#\/%?=~_|!:,.;]*[-A-Z0-9+\u0026@#\/%=~_|])/gi,
        lt = '\u003c',
        gt = '\u003e';

    $('*:not(a, script, style, textarea)').contents().each(function() {
        if (this.nodeType == Node.TEXT_NODE) {
            var textNode = $(this);
            var span = $(lt + 'span/' + gt).text(this.nodeValue);
            span.html(span.html().replace(exp, lt + 'a href=\'$1\'' + gt + '$1' + lt + '/a' + gt));
            textNode.replaceWith(span);
        }
    });
}

$(autolink);

Редактировать: Исключены текстовые области, сценарии и встроенный CSS. Хочу заметить, что это также можно сделать с помощью splitText чистого DOM , который имеет преимущество в том, что не добавляет дополнительных элементов span.

Редактировать 2: Устранены все амперсанды и двойные кавычки.

Редактировать 3: Избавился также от символов <и>.

3 голосов
/ 17 октября 2010

Эта проблема выходит за рамки регулярных выражений.Вы могли бы написать регулярное выражение, которое могло бы избежать некоторых ссылок, но вы не смогли бы избежать каждой существующей ссылки.

Хорошая новость заключается в том, что другой подход сделает работу намного проще.Прямо сейчас вы используете document.body.innerHTML, чтобы манипулировать HTML как простым текстом.Чтобы сделать это правильно, вам, в основном, нужно будет разобрать HTML самостоятельно.Но вам не нужно, , потому что браузер уже проанализировал его для вас!

Веб-браузер позволяет вам получить доступ к документу HTML как к серии объектов.Она называется Document Object Model (DOM), и если вы немного прочтете ее, вы сможете научиться проходить через HTML, пропускать что-либо внутри элемента A и использоватьрегулярное выражение у вас есть только на открытом тексте.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...