Question

我已经编写了我认为正确的代码，但是尽管它运行无误，但没有任何替换。另外，我不确定应该使用什么事件来执行代码。

测试登陆页面的简单模板。通过url传递的令牌将用于替换模板中的标记或令牌。

<!DOCTYPE html>

<html>

<head>
  <title>TODO supply a title</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script>
    // gets passed variables frm the url
    function getQueryVar(str) {
      return 'Newtext'; // JUST  SCAFFOLD FOR TESTING
    }

    function searchReplace() {
      /**/
      var t = 0;
      var tags = Array('keyword', 'locale', 'advert_ID');

      if (document.readyState === 'complete') {
        var str = document.body.innerText;

        for (t = 0; t < tags.length; t++) {
          //replace in str every instance of the tag with the correct value

          if (tags[t].length > 0) {
            var sToken = '{ltoken=' + tags[t] + '}';
            var sReplace = getQueryVar(tags[t]);
            str.replace(sToken, sReplace);
          } else {
            var sToken = '{ltoken=' + tags[t] + '}'
            var sReplace = '';
            str.replace(sToken, sReplace);
            //str.replace(/sToken/g,sReplace); //all instances

          }
        }
        document.body.innerText = str;
      }


    }
  </script>
</head>

<body>
  <H1> THE HEADING ONE {ltoken=keyword}</H1>
  <H2> THE HEADING TWO</H2>
  <H3> THE HEADING THREE</H3>
  <P>I AM A PARAGRAPH {ltoken=keyword}</P>

  <div>TODO write content</div>

  <input type="button" onclick="searchReplace('keyword')">
</body>

</html>

因此，当文档完成加载后，我想执行此代码，它将用getQueryVar返回的关键字的值替换{ltoken = keyword}。目前，它什么也不会取代，但不会引起错误

Answer 1

您的问题是您没有将字符串的替换重新分配回其父项。

str.replace(sToken,sReplace);

应该是

str = str.replace(sToken,sReplace);

.replace方法返回修改后的字符串，它不对变量本身执行操作。

Answer 2

使用innerHTML代替innerText，然后使用for循环尝试

tags.forEach(t=> str=str.replace(new RegExp('{ltoken='+ t+'}','g'), getQueryVar(t)))

<!DOCTYPE html>

    <html>
           <head>
          <title>TODO supply a title</title>
           <meta charset="UTF-8">
           <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <script>
     // gets passed variables frm the url
   function getQueryVar(str)
   {
               return'Newtext';// JUST  SCAFFOLD FOR TESTING
   }        

   function searchReplace() {
   /**/
   var t=0;
   var tags =Array('keyword','locale','advert_ID');

   if (document.readyState==='complete'){
   var str = document.body.innerHTML;
       tags.forEach(t=> str=str.replace(new RegExp('{ltoken='+ t+'}','g'), getQueryVar(t)));
       //tags.forEach(t=> str=str.replace(new RegExp('{ltoken='+ tags[t]+'}', 'g'), getQueryVar(tags[t])));

       
   document.body.innerHTML=str;
   }


   }

   </script>
       </head>
       <body   >
           <H1>  THE HEADING ONE {ltoken=keyword}</H1>
            <H2>  THE HEADING TWO</H2>   
            <H3>  THE HEADING THREE</H3> 
            <P>I AM A PARAGRAPH {ltoken=keyword}</P>

           <div>TODO write content</div>

           <input type ="button" onclick="searchReplace('keyword')" value="Clicke ME">
       </body>
   </html>

如何使用Java脚本替换html文档中的文本

2 个答案: