JS中常见的字符串拼接处理

最近动态的编写界面的时候总是需要不定时的用到js,而字符串的拼接还有在jsp文件获取后台的数据变量是个使用的麻烦，我把我碰到的列举一下，希望对以后看到这个问题的人有所帮助

1. JS获取java后台在jsp中的变量

<% 
        String columnName=(String)request.getAttribute("columnName");
        String datas=(String)request.getAttribute("data");  
        String dataBase=(String)request.getAttribute("dataBase");
        String table=(String)request.getAttribute("table");
%>

在jsp中的html中获取java的变量用<%=columnName %>,例如在写表单的时候的action中传递参数用到后台传来的数据（传递两个参数dataBase，table,参数之间用&隔开）

 <form id="form" action="save.do?dataBase=<%=dataBase %>&table=<%=table %>">

但是js获取java中的变量的时候就要多个引号，例如

<script type="text/javascript">
    var columnNames = '<%=columnName %>';
</script>

如果js中需要后台传的一个一维数组的话，可以获取数据名，再转换成数组。（上边的columnName是我在java后台用jsonlib处理的一个json字符串，下边有补充怎么转换）

    var columnNames = '<%=columnName %>';
    var names=eval(columnNames);
    for(var i=0;i<names.length;i++){ //do something};

如果js中需要二维数组的话，首先需要在后台把二维数组进行一个加工，之后用Jsonlib处理成字符串之后传到界面，之后js获取字符串，在js中像上边传一维数组那样进行两层的解析。

<script type="text/javascript">
        var datas='<%=datas %>';//二维数组json串
        var lines=eval(data);//二维数组，每个元素是一个一维数组json串
        var idata='';
        for(i=0;i<lines.length;i++){
            var line=eval(lines[i]);//一维数组，包含数据
            idata+='<tr id="'+i+'">';//注意1
            for(var j=0;j<line.length;j++){
            idata+='<td><input id="td'+i+''+j+'" value='+line[j]+'></td>';  //注意2，
            //这个拼接i和j是为了后边我可以动态的获取所有的有i,j标记的input标签用的，来获取input中的值
            }
            idata+='</tr>';
        }
        $('#ibody').append(idata);
</script>
    //前台的代码
    <form id="form" style="margin-left: 10px">
        <table id="table" border="1px solid #fff" cellspacing="0px">
            <thead id="ihead" bgcolor="#F0F0F0"></thead>
            <tbody id="ibody"></tbody>//插入动态数据的地方
        </table>
    </form>

解释下上边的需求，datas是一个后台传过来的二维数组组成的json串，初次解析成lines数组，降维，之后再把lines中的每个元素解析，lines的每个元素都是一个一维数组的json串，之后把数据拼接成一个表单中的标签<tr><td><input id="" value=? ></td></tr> 这种形式的一行一行的字符串idata,在把这些插入到一个id为ibody的form标签中。实现动态的生成可编辑的表单。
2. js拼接字符串
一般就是三种形式：

• 普通的拼接

var idata+='</tr>';

• 拼接变量后边的变量可以用单引号括起来，也可以用双引号，但是必须得有引号.

var data='dataBase='+"<%=dataBase %>"
var ihead+='<td><input readonly="true" value='+names[k]+'></td>';

• 拼接id– 这个是最费事的，也是最容易出错的，因为在标签中id的值是用” “括起来的，例如<div id="what"></div> 当值为静态的还好说，但是当设置动态的id的时候就要小心了，看上边我标记为 （注意1）的代码

idata+='<tr id="'+i+'">';

当所拼接的id为含有多个连续的变量的时候，看（注意2）的代码

idata+='<td><input id="td'+i+''+j+'" value='+line[j]+'></td>'; 

所以总结一个规律，当拼接id的时候可以把'+变量+' 当成一个字符串的变量来处理
还有补充一点就是用jQuery动态获取标签的时候也可能用到字符串的拼接

$("#"+i+"").remove()

找到指定的标签删除。

PS:补充上边后台对json串的处理，因为我的需求是即需要传递一维数组，也需要二维数组，所以我的做法就是

• 一维数组的数据都存放在List中，然后在用jsonlib去中的加工list的方法转换成json字符串，例如上边的columnName。

List<String> columnNameArr = newArrayList<String>();
columnNameArr.add("数据");
String columnName=JSONArray.fromObject(columnNameArr).toString();
ServletActionContext.getRequest().setAttribute("columnName", columnName);//利用request传输字符串到前台

• 加工二维数组，

List<List<Object>> datas = new ArrayList<List<Object>>();
while (dataRet.next()) {
        List<Object> one = new ArrayList<Object>();
        for (String s : columnNameArr) {
                one.add(dataRet.getString(s));
        }
            datas.add(one);
}
String data = JSONArray.fromObject(datas).toString();

加工都一样，就是list中套着很多的list,这是我用的方法，可能还有更简便的，那就见仁见智了。用jsonlib工具类的时候需要导入几个jsonlib对应的jar包，如果没有我上传了一个，在我的资源中。在我上传的资源中有jsonlib的其他应用，例如加工map,加工一个实体类等等。感兴趣的可以看一下。