2017.6.30 Note replace innerHTML split() join()

　　1、运用的知识为JS中字符串到HTML标签的转化：  使用.innerHTML，如：  div.innerHTML = str; 

　　2、主要思路转换：  切记千万不可转牛角尖，转牛角尖只会坏事，要冷静分析每一步，找出每一步的关键点是什么，这样才能极快速的完成项目，如下例中

此例中主要包含3个思路：

　　（1）将字符串数组中包含特定字符的字符串挑选出来，可以使用.indexOf( str )，若是存在此特定字符则其会有索引值即>=0　　

　　（2）选出字符串中的特定字符并加以操作，可以使用循环（for）与条件（if）语句，利用for遍历字符串字符，if挑选出该字符，将其重新赋值即可

　　（3）如何将字符串转换为Html标签，使用.innerHTML，即div.innerHTML = str;，从而将字符串转化为HTML标签完成对此特定字符的样式设置

 1 search.addEventListener( "click", function() {
 2             var a = text.value;
 3             for (var j=0; j<myArray.length; j++) {
 4                     var b = myArray[j].split("");
 5                     console.log(b);
 6                     var inner = document.getElementsByClassName( "inner" );
 7                     inner[j].innerHTML = b.map( function( item ) {
 8                         item = item.replace( new RegExp( a, "g" ), "<span>" + a + "</span>" );
 9                         console.log(item);
10                         return item;
11                     }).join("");    
12                 }
13         }, false )

改进： 方法1不仅复杂且不能连续查询，因为是createElement的，所以当连续查询不同内容时，前一个查询的内容中若是不包含此字符则不会发生replaceChild()，所以其上的样式就不会更改

　　2、注意一个思路，即JS是JS，CSS是CSS，不要将CSS插入到JS中，应该分开

此方法的思考思路是：

　　将输入的每一个字符串都检测可以使用for也可以使用map，而每一个字符串都要检测其是否包含特定字符如果是则替换，而检测则可以考虑上文中的方法1中的for，和此处的.replace（）+ RegExp的方法，利用正则匹配，然后利用replace替换，最后将其join为字符串，然后将字符串替换文中的块class = “inner”的HTML内容，达到替换目的

　　

转载于:https://www.cnblogs.com/swallowBoy/p/7101032.html