Выберите номера на странице с помощью jQuery или Javascript - PullRequest
Новая
       17

Выберите номера на странице с помощью jQuery или Javascript

9 голосов
/ 26 июня 2011

Мне просто интересно, есть ли способ найти номера на странице с помощью jQuery или обычного Javascript.

Вот что я хочу сделать:

Скажите "23 июня" на странице. То, что я хочу сделать, это иметь возможность добавлять и добавлять некоторые <span> селекторы к числу.

Использование :contains() с jQuery выбирает все, а не только число.

Эти строки генерируются без каких-либо элементов переноса в теме Wordpress, над которой я работаю, и я хочу выбрать только число .

Любая помощь будет принята с благодарностью! Спасибо, что даже подумал об этом.
-Джордж

Ответы [ 3 ]

9 голосов
/ 26 июня 2011

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

var regex = /(\d+)/,
    replacement = '<span>$1</span>';

function replaceText(el) {
    if (el.nodeType === 3) {
        if (regex.test(el.data)) {
            var temp_div = document.createElement('div');
            temp_div.innerHTML = el.data.replace(regex, replacement);
            var nodes = temp_div.childNodes;
            while (nodes[0]) {
                el.parentNode.insertBefore(nodes[0],el);
            }
            el.parentNode.removeChild(el);
        }
    } else if (el.nodeType === 1) {
        for (var i = 0; i < el.childNodes.length; i++) {
            replaceText(el.childNodes[i]);
        }
    }
}

replaceText(document.body);

Пример: http://jsfiddle.net/JVsM4/

Это не наносит ущерба существующим элементам и связанным с ними данным jQuery.

РЕДАКТИРОВАТЬ: Вы могли бы немного сократить его с небольшим jQuery: 

var regex = /(\d+)/g,
    replacement = '<span>$1</span>';

function replaceText(i,el) {
    if (el.nodeType === 3) {
        if (regex.test(el.data)) {
            $(el).replaceWith(el.data.replace(regex, replacement));
        }
    } else {
        $(el).contents().each( replaceText );
    }
}

$('body').each( replaceText );

Пример: http://jsfiddle.net/JVsM4/1/

Обратите внимание, что регулярному выражению требуется глобальный модификатор g.

Возможно, немного медленнее, поэтому, если DOM достаточно велик, я бы использовал версию не-jQuery.

1 голос
/ 26 июня 2011

Просто мысли вслух, но ты думаешь, это сработает? 

document.body.innerHTML = document.body.innerHTML.replace(/(\d+)/g, "<span class='number'>$1</span>")
0 голосов
/ 26 июня 2011

Это полностью зависит от того, в каком формате ваша дата.

Я нашел этот сайт с множеством различных регулярных выражений (потому что вы просто ищете обычный фрагмент текста для даты).

Это хороший вариант, если вы используете формат вашей даты (дд МММ гггг): http://regexlib.com/REDetails.aspx?regexp_id=405

Я предполагаю, что, поскольку это шаблон, ваши даты будут одинаковыми для всех страниц.,Так что формат будет таким же.Вы можете использовать регулярное выражение для каждого фрагмента текста в вашем шаблоне, если вы правильно его определили.

...