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>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | 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); } }); } |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步