Question

所以基本上我有2个textareas

原创

array(1) { [0]=> string(13) "Successfully!" }

和已修改

<textarea id="original">
238e2d079751457785266d20c7a6c27c=AoE
2d6debfef8cc4bd0ad2b0d8310d7abce=Buff
a90e94d629b24ca5bc384abccd88e1e6=Channeling
68072537e0794f59bfe6b7a60cbae650=Dash
0e8264cec48b4be189ce67244cd29cc3=EX
</textarea>

我需要的是比较两个ID（在=之前的所有内容）的代码，如果id相同但是值（在=之后的东西）不会覆盖该值，否则它将保留该值。

ID永远不会改变！

结果看起来像

<textarea id="mod">
a90e94d629b24ca5bc384abccd88e1e6=Channel5
68072537e0794f59bfe6b7a60cbae650=Dashing through the snow
0e8264cec48b4be189ce67244cd29cc3=EX Dee
</textarea>

Answer 1

你需要在几个步骤中完成你的任务......为了简化这里的故事是有效的解决方案，应该从代码和评论中清楚solution

我正在做的是：1。将文本区域的内容转换为对象。 2.比较对象。 3.更新原始文本区域的内容

  // just get elements that we will work with
  var originalTextArea = document.querySelector('#original');

  // 1. split content of text areas into lines
  // 2. make objects with key - value pairs 

  var originalConent = document.querySelector('#original').textContent.split('\n');
  // console.log(originalConent);

  var listOriginal = {};

  originalConent.forEach(line => {
     var key_value = line.split('=');
     // just make sure we don't catch empty line
     if(key_value.length > 1){
       var key = key_value[0];
       var value = key_value[1];
       listOriginal[key] = value;
       // console.log(key_value);
     }
  });

  console.log(listOriginal);

  var modifiedConent = document.querySelector('#mod').textContent.split('\n');
  // console.log(modifiedConent);

  var listModified = {};

  modifiedConent.forEach(line => {
    var key_value = line.split('=');
    // just make sure we don't catch empty line
    if(key_value.length > 1){
      var key = key_value[0];
      var value = key_value[1];
      listModified[key] = value;
      // console.log(key_value);
    }
  });

  console.log(listModified);  

 // 3. check if values in modified are different
 //    if values are different - update them in original objects
 //    update content of text area with original data

document.querySelector('#update').addEventListener('click', updateOriginal);

function updateOriginal(){

  // iterate listModified object and update listOriginal
  for (var key in listModified) {
    // just assing value of modified to original
    // in this case even new key - value pairs will be added
    listOriginal[key] = listModified[key];
  }

  // update data of original text area
  var textData = '';
  for (var key in listOriginal) {
    textData+=`${key}=${listOriginal[key]}\n`;
  }    

  originalTextArea.textContent = textData;
}

如何比较textarea

1 个答案: