Блог

Главная - Вопросы по программированию - Javascript: как динамически создавать и объединять текстовые узлы?

Javascript: как динамически создавать и объединять текстовые узлы?

#javascript #html #arrays #string #nodes

#javascript #HTML #массивы #строка #узлы

Вопрос:

Это функция проверки, которая принимает ввод электронной почты и сохраняет неправильные символы внутри неверного массива с помощью match . Что я хочу сделать, так это иметь возможность рисовать линию через неправильные символы, используя тег S. Если электронное письмо содержит один недопустимый символ, например ab c@abc.abc , линия проходит через » » правильно и отображает ab c@abc.abc Однако, если имеется более одного недопустимого символа, например a b c@abc.abc , оба » » будут зачеркнуты, но когда они отобразятся на экране, они будут перемещенырядом друг с другом, например ab c@abc.abc . Мне нужна помощь в том, как заставить этот текст отображаться как a b c@abc.abc .

 function validate()
{
  var str = document.getElementById("email").value;
  var len = str.length;

  var patt1 =  /^[^;,':?!*#^amp;@ -] w @{1}w .{1}w $/;

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

   if(patt1.test(str))
  {
    document.getElementById("validate").innerHTML = "valid";
  }

В противном случае мы сохраним плохие

   else
  {
    alert("not a valid email");
    document.getElementById("validate").innerHTML = "";
    var bad = str.match(/[;,':?!*#^amp;@ -] /);    

    var wholestr = document.getElementById("validate");

    var x = document.createElement("S");

Здесь я попытался динамически создавать переменные в массиве, все с их отдельными текстовыми узлами. Сначала это делается для недопустимых символов, затем для допустимых символов. Каждый новый текстовый узел добавляется в wholestr, который будет отображаться на экране. Идея заключалась в том, чтобы каждый символ был отдельным текстовым узлом, чтобы недопустимые символы не отображались рядом; однако это все равно происходит.

     for(var i = 0; i < len; i  )
    {   
      for(var j = 0; j < bad.length; j  )
      {
        if(str[i] == bad[j])
        {
           var errors = [];

           for(var k = 0; k < bad.length; k  )
           {
              errors[k] = document.createTextNode(bad[j]);
           }

           for(var k = 0; k < errors.length; k  )
           {
             x.appendChild(errors[k]);
             wholestr.appendChild(x);
           }

        }
        else
        {
           var valids = [];

           for(var k = 0; k < str.length; k  )
           {
              valids[k] = document.createTextNode(str[i]);
           }


            wholestr.appendChild(valids[i]);

           //var str1 = document.createTextNode("");
           //str1.textContent = str[i];
           //wholestr.appendChild(str1);
        }
      }  
    }

  }


}

Комментарии:

1. это редактирование первого абзаца, когда ab c@abc.abc вводится, результат равен ab<s> </s>c@abc.abc

Ответ №1:

Просто ответил на вопрос, моя ошибка была довольно простой, она была связана с элементом x, который содержал тег S.

 function validate()
{
  var str = document.getElementById("email").value;
  var len = str.length;

  var patt1 =  /^[^;,':?!*#^amp;@ -] w @{1}w .{1}w $/;

  if(patt1.test(str))
  {
    document.getElementById("validate").innerHTML = "valid";
  }
  else
  {
    alert("not a valid email");
    document.getElementById("validate").innerHTML = "";
    var bad = str.match(/[;,':?!*#^amp;@ -] /);    

    var wholestr = document.getElementById("validate");

    for(var i = 0; i < len; i  )
    {   
      for(var j = 0; j < bad.length; j  )
      {
        if(str[i] == bad[j])
        {
           var errors = [];

Здесь мне нужен был еще один динамический массив, в котором хранились элементы с тегом S. Таким образом, каждый недопустимый символьный узел будет добавлен к своему собственному document.createElement(«S») 

            var x = [];

           for(var k = 0; k < bad.length; k  )
           {  
              x[k] = document.createElement("S");
              errors[k] = document.createTextNode(bad[j]);
           }

           for(var k = 0; k < errors.length; k  )
           {
             x[k].appendChild(errors[k]);
             wholestr.appendChild(x[k]);
           }

        }
        else
        {
           var valids = [];

           for(var k = 0; k < str.length; k  )
           {
              valids[k] = document.createTextNode(str[i]);
           }


            wholestr.appendChild(valids[i]);

           //var str1 = document.createTextNode("");
           //str1.textContent = str[i];
           //wholestr.appendChild(str1);
        }
      }  
    }

  }


}