thymeleaf javascript ajax说明 及org.xml.sax.SAXParseException: The content of elements must consist of well-formed character data or markup 错误

关于thymeleaf 在html中的引用：

js的引用

<script th:src="@{/test/js/jquery-1.9.1.min.js}"></script>
<script th:src="@{/test/js/jquery.SuperSlide.2.1.1.js}"></script

图片的引用:

 

<img th:src="@{/test/images/logo.png}" width="195" height="87" alt=""/>

css的引用：

 

<link th:href="@{/test/css/imagesq_style.css}" rel="stylesheet" type="text/css"/>
<link th:href="@{/test/css/animate.css}" rel="stylesheet" type="text/css"/>

js脚本中要注意的：没有下面这些 会报在spring boot中报错：
00:46:32.733 [http-apr-8080-exec-7] ERROR o.t.templateparser.ErrorHandler - [THYMELEAF][http-apr-8080-exec-7] Fatal error during parsing

org.xml.sax.SAXParseException: The content of elements must consist of well-formed character data or markup.

<script  th:inline="javascript">
    /*<![CDATA[*/

变量定义及函数

    /*]]>*/
</script>

关于在ajax中使用和平时一样：

//返回带样式的词性标注 ，代码中 有拼接一个<dl><dd></dd></dl>

 function word_pos(){

        var value = {"v":{"color":"#FF6B0F","name":"\u52a8\u8bcd"},"c":{"color":"#51A3FA","name":"\u8fde\u8bcd"},"p":{"color":"#B27A01","name":"\u4ecb\u8bcd"},"d":{"color":"#4DB9D3","name":"\u526f\u8bcd"},"r":{"color":"#558E1D","name":"\u4ee3\u8bcd"},"nr":{"color":"#7CCC2B","name":"\u4eba\u540d"},"q":{"color":"#6A8CB1","name":"\u91cf\u8bcd"},"n":{"color":"#077BF6","name":"\u540d\u8bcd"},"ns":{"color":"#F65D00","name":"\u5730\u540d"},"w":{"color":"#A3D1FF","name":"\u6807\u70b9"},"m":{"color":"#A3DF65","name":"\u6570\u8bcd"},"e":{"color":"#CD8C62","name":"\u53f9\u8bcd"},"u":{"color":"#FF4D4D","name":"\u52a9\u8bcd"},"y":{"color":"#89D2E3","name":"\u8bed\u6c14\u8bcd"},"z":{"color":"#FF9A5C","name":"\u72b6\u6001\u8bcd"},"a":{"color":"#FEC64B","name":"\u5f62\u5bb9\u8bcd"},"f":{"color":"#83EC15","name":"\u65b9\u4f4d\u8bcd"},"s":{"color":"#C6C2FF","name":"\u5904\u6240\u8bcd"},"b":{"color":"#7FCB9C","name":"\u533a\u522b\u8bcd"},"o":{"color":"#FDB717","name":"\u62df\u58f0\u8bcd"},"t":{"color":"#B1D6FF","name":"\u65f6\u95f4\u8bcd"},"nz":{"color":"#D0CEE3","name":"\u5176\u4ed6\u4e13\u540d"},"nt":{"color":"#FFAF00","name":"\u673a\u6784\u56e2\u4f53"},"xxx":{"color":"#A4B2BF","name":"\u5176\u4ed6"},"xxxx":{"color":"","name":"\u672a\u77e5"}};
        value = eval(value);

        /*var data = "{\"word\":[{\"id\":\"1\", \"cont\": \"我\",\"pos\":\"nr\" },{\"id\":\"2\", \"cont\": \"爱\",\"pos\":\"v\" },         {\"id\":\"3\", \"cont\": \"北京\",\"pos\":\"ns\" },{\"id\":\"4\", \"cont\": \"天安门\",\"pos\":\"ns\" },         {\"id\":\"5\", \"cont\": \"。\",\"pos\":\"w\" }]}"
        str_arr = eval("(" + data + ")");*/

        var jsonObj ={};
        jsonObj['data'] = $("#passage").val();
        $.ajax({
            url:'/nlp/test2' ,
            type:"POST",
            data:JSON.stringify(jsonObj),
            contentType: "application/json;charset=UTF-8",
            dataType:"json",
            async : false,
            success:function(result){
                $("#cxfx").empty();
                var content =  "<dl class='words'>";
                var word = result.data;
                var data = JSON.parse(word);
                var arr = data.word;
                for(i = 0; i < arr.length; i++){
                    if(arr[i].pos in value){
                        var dd_color = value[arr[i].pos].color;
                    }
                    content += "<dd class='changedd "+arr[i].pos+"' style='background:" +dd_color+"'>"+arr[i].cont+"</dd>";
                }
                content += "</dl>";
                $("#cxfx").append(content);
            }

        });
    }