createElement("div") 创建一个div 和 直接用字符串拼接一个div一样吗?

var s = "

"
document.getElementById("wechat").innerHTML = s;

直接用document.createElement("div") ;
这样的效果一样吗?

4个回答

效果一样,但是用innerHTML更新UI时,如果容器包含表单元素已经输入了内容,会被清空,最好是用dom api来添加,appendChild之类的

效果一样,但方式不一样,js生成的更方便操作一些,遇到特殊情况更容易处理一些,拼接字符串填充到页面上的,代码量会大一些,写起来的时候还要注意转义,而且还得有特定的div来innerHTML,两种方法各有各得好处吧

效果是一样在,但实现不一样,个人不建议直接用字符串来拼div

看情况吧,ES6 可以用模板字符串其实也不错

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
ajax同时上传xlsx文件和1条字符串,参数怎么传递
单独上传xlsx没有问题,但是多加一条字符串报错:org.springframework.web.multipart.MultipartException: The current request is not a multipart request 以下是我的代码: jsp: ``` <div class="btn-file col-md-6"> <button id="btn_upload" type="button" class="btn btn-success" style="width: 100px;margin-right: 20px"> <i class="fa fa-cloud-upload" aria-hidden="true"></i> 文件上传 </button> </div> ``` js: ``` $("#btn_upload").on("click", function () { var date = $("#date").val(); var s = document.getElementById("fileUpload"); if (s !== undefined) { $("#fileUpload").remove(); } var inputObj = document.createElement('input'); inputObj.setAttribute('id', 'fileUpload'); inputObj.setAttribute('type', 'file'); inputObj.setAttribute('name', 'file'); inputObj.setAttribute('accept', '.csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel'); inputObj.setAttribute("style", 'visibility:hidden'); document.body.appendChild(inputObj); inputObj.click(); $("#fileUpload").on('change', function () { $("#inputText1").val(this.files[0].name); if ($("#fileUpload").val() !== "") { var formData = new FormData(); formData.append("file",this.files[0]); $.ajax({ type: "post", url: appName + '/report/upload.do', data: { data:data, file:formData }, dataType: "text", processData: false, contentType: false, success: function (result) { if (result == "success"){ layer.msg("提交成功!", {icon: 6, time: 3000}); } else { layer.msg("提交失败!", {icon: 2, time: 3000}); } }, error: function () { layer.msg("请求失败!", {icon: 2, time: 3000}); } }); layer.msg('文件上传!', {icon: 1, time: 3000}); } else { layer.msg("请先选择文件!"); } }); }); ``` controller: ``` @RequestMapping(value="/upload.do") @ResponseBody public String upload(String date, MultipartFile file) throws IOException { String path = "F:\\upload"; String fileName = file.getOriginalFilename(); File dir = new File(path,fileName); if(!dir.exists()){ dir.mkdirs(); } //MultipartFile自带的解析方法 file.transferTo(dir); System.out.println(date); System.out.println(fileName); return "fail"; } ```
多个div浮窗的只有一个能移动的问题
同一个页面 显示多个div浮窗(多个浮窗的内容并不一样,也在不同的div中 演示代码里是只举例了一种) 只有一个能移动 请问那个是判断我现在移动的是哪个浮窗 ,怎么才能分别移动 不冲突呢? 如果我描述的不够清楚 我还可以补充说明。 演示代码如下: ``` <html> <head> <title>Js弹出浮动窗口,支持鼠标拖动和关闭</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript"> /** 关于一些参数说明: *bodycontent:要在窗口显示的内容,dom对象 *title:窗口标题,字符串类型 *removeable:窗口能否拖动,布尔类型 *注意:内容窗体的高度是height-30px,请计算好你要显示的内容的高度和宽度。弹出窗的id为"223238909",所以你的页面不要再取值为"223238909"的id了,以防js执行出错*/ function createdialog(width,height,bodycontent,title,removeable){ if(document.getElementById("www_jb51_net")==null){ /*创建窗口的组成元素*/ var dialog = document.createElement("div"); var dialogtitlebar= document.createElement("div"); var dialogbody = document.createElement("div"); var dialogtitleimg = document.createElement("span"); var dialogtitle = document.createElement("span"); var dialogclose = document.createElement("span"); var closeaction = document.createElement("button"); /*为窗口设置一个id,id如此怪异是为了尽量避免与其他用户取的id相同而出错*/ dialog.id = "223238909"; /*组装对话框标题栏,按从里到外的顺序组装*/ dialogtitle.innerHTML = title; dialogtitlebar.appendChild(dialogtitleimg); dialogtitlebar.appendChild(dialogtitle); dialogtitlebar.appendChild(dialogclose); dialogclose.appendChild(closeaction); /*组装对话框主体内容*/ if(bodycontent!=null){ bodycontent.style.display = "block"; dialogbody.appendChild(bodycontent); } /*组装成完整的对话框*/ dialog.appendChild(dialogtitlebar); dialog.appendChild(dialogbody); /*设置窗口组成元素的样式*/ var templeft,temptop,tempheight//窗口的位置(将窗口放在页面中间的辅助变量) var dialogcssText,dialogbodycssText;//拼出dialog和dialogbody的样式字符串 templeft = (document.body.clientWidth-width)/2; temptop = (document.body.clientHeight-height)/2; tempheight= height-30; dialogcssText= "position:absolute;background:#65c294;padding:1px;border:4px;top:"+temptop+"px;left:"+templeft+"px;height:"+height+"px;width:"+width+"px;"; dialogbodycssText = "width:100%;background:#ffffff;"+"height:" + tempheight + "px;"; dialog.style.cssText = dialogcssText; dialogtitlebar.style.cssText = "height:30px;width:100%;background:url(images/titlebar.png) repeat;cursor:move;"; dialogbody.style.cssText = dialogbodycssText; dialogtitleimg.style.cssText = "float:left;height:20px;width:20px;background:url(images/40.gif);"+"display:block;margin:4px;line-height:20px;"; dialogtitle.style.cssText = "font-size:16px;float:left;display:block;margin:4px;line-height:20px;"; dialogclose.style.cssText = "float:right;display:block;margin:4px;line-height:20px;"; closeaction.style.cssText = "height:20px;width:24px;border-width:1px;"+"background-image:url(images/close.png);cursor:pointer;"; /*为窗口元素注册事件*/ var dialogleft = parseInt(dialog.style.left); var dialogtop = parseInt(dialog.style.top); var ismousedown = false;//标志鼠标是否按下 /*关闭按钮的事件*/ closeaction.onclick = function(){ dialog.parentNode.removeChild(dialog); } /*实现窗口的移动,这段代码很典型,网上很多类似的代码*/ if(removeable == true){ var ismousedown = false; var dialogleft,dialogtop; var downX,downY; dialogleft = parseInt(dialog.style.left); dialogtop = parseInt(dialog.style.top); dialogtitlebar.onmousedown = function(e){ ismousedown = true; downX = e.clientX; downY = e.clientY; } document.onmousemove = function(e){ if(ismousedown){ dialog.style.top = e.clientY - downY + dialogtop + "px"; dialog.style.left = e.clientX - downX + dialogleft + "px"; } } /*松开鼠标时要重新计算当前窗口的位置*/ document.onmouseup = function(){ dialogleft = parseInt(dialog.style.left); dialogtop = parseInt(dialog.style.top); ismousedown = false; } } return dialog; }//end if(if的结束) } </script> <style> table{background:#b2d235;} button{font-size:12px;height:23;background:#ece9d8;border-width:1;} #linkurl,#linkname,#savelink{width:100px;} </style> </head> <body> <!-- 显示窗口的地方 --> <div id="here"></div><a id="clickhere" href="#">点击生成窗口</a> <!-- 要嵌入到窗口的内容 --> <div id="login" style="display:none;"> <form action="#" method="post" onSubmit="return false;"> <table width="400" height="95"> <tr> <td width="78">链接文字</td> <td width="168"><input name="link.name" type="text" value="浮窗测试"/></td> <td width="138" id="linktext"></td> </tr> <tr> <td>链接地址</td> <td><input name="link.url" type="text" value="f"/></td> <td id="linkurl"></td> </tr> <tr> <td></td> <td><button type="submit" style="float:right;">添加</button></td> <td id="savelink"></td> </tr> </table> </form> </div> <script type="text/javascript"> var here = document.getElementById("here"); var login = document.getElementById("login"); var clickhere = document.getElementById("clickhere"); clickhere.onclick = function(){ here.appendChild(createdialog(400,95+30,login,"中国外汇交易中心",true)); } </script> </body> </html> ```
动态添加的div在打印是没有显示,请问是怎么回事(备注:只有火狐浏览器是这样)
这是打印代码: function test(){ var dh=$("#show").innerHeight();//获取div高度 //alert("fire"); var a4=975;//a4纸高度 var s=dh/a4;//总页数 var z=parseInt(s);//取整 var y=dh/a4-z;//取余 if (y>0) { z=z+1; } for ( var int = 1; int <=z; int++) { var div=document.createElement("div"); div.innerHTML='<tr><td>'+int+'/'+z+'</td></tr>'; div.style.backgroundColor="black"; div.style.position="absolute"; div.style.top=a4*int+int*10+"px"; //div.style.left="80%"; div.style.height="20px"; div.style.marginLeft="0px"; $("#show").append(div); alert(div.style.top); } } function Print() { test(); var Html_body = window.document.body.innerHTML; //var printStr = "<html><head><meta http-equiv=\"Content-Type\" content=\"text/html;charset=utf-8\"></head><body >"; //var content = ""; var bdhtml = window.document.body.innerHTML; //获得body标签内的全部html代码 var sprnstr = "<!--startprint-->"; //声明一个字符串,用于表示打印的起始位置 var eprnstr = "<!--endprint-->"; //标示打印的结束位置 var prnhtml = bdhtml.substr(bdhtml.indexOf(sprnstr) + 17); //查找打印的起始字符串并加上17,因为<!--startprint-->的长度为17 prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr)); window.document.body.innerHTML = prnhtml; //var str = document.getElementById('show').innerHTML; //获取需要打印的页面元素 ,page1元素设置样式page-break-after:always,意思是从下一行开始分割。 //content = content + str; //printStr = printStr + content + "</body></html>"; ////var p = document.getElementById("show"); ////p.style.display = "none"; ////var se = document.getElementById("select"); ////se.style.display = "none"; //document.body.innerHTML = printStr; window.print(); window.document.body.innerHTML = Html_body; }
大家帮我看一下这个js 字符串转数字 出了什么问题
![图片说明](https://img-ask.csdn.net/upload/201703/14/1489495572_936526.png) ![图片说明](https://img-ask.csdn.net/upload/201703/14/1489495584_300820.png) 第一张图都还是“1” 用了个转换函数就成undefine了 ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>task2-4</title> <style type="text/css" > form{ width: 400px; margin-left: auto; margin-right: auto; margin-top: 20px; } div div{ width: 30px;height: 30px;background-color: red;display: inline-block; margin: 5px;text-align: center;line-height: 30px; } #show{ width: 500px; margin-left: auto; margin-right: auto; } #show p{ margin: 0px; font-size: 150%; } </style> </head> <body> <form > <input id="numInput" type="text" value="请输入整数"> <input id="leftIn" type="button" value="左侧入"> <input id="rightIn" type="button" value="右侧入"> <input id="leftOut" type="button" value="左侧出"> <input id="rightOut" type="button" value="右侧出"> </form> <div id ="show"> </div> <script type="text/javascript"> var show = document.getElementById("show"); var myarr = new queue(); var txtinput =document.getElementById("numInput"); var rightIn = document.getElementById("rightIn"); //点击行为引发3件事 更新数组,更新方块,更新里面的数字 rightIn.onclick = function () { myarr.rightIn(numInput); draw("+"); assignNum(); } var rightOut = document.getElementById("rightOut"); rightOut.onclick =function () { myarr.rightOut(numInput); draw("-"); assignNum(); } var leftIn = document.getElementById("leftIn"); leftIn.onclick = function () { var numIn = parseInt(txtinput.value); myarr.leftIn(numIn); draw("+"); assignNum(); } var leftOut = document.getElementById("leftOut"); leftOut.onclick =function () { myarr.leftOut(numInput); draw("-"); assignNum(); } //给出 两端能进能出队列类的方法和属性的定义 //假设数组的从左往右分别是 arr[0],arr[1],arr[2]..... function queue() { var arr =[]; var length=0; this.rightOut=function () { arr[this.length-1]=null; this.length--; }; this.rightIn=function (num) { arr[this.length]=num; this.length++; }; this.leftIn=function (num) { if(length==0){arr[0]=num;}else{ for(var i=this.length-1; i>0;i--){ arr[i+1] = arr[i]; } arr[0] = num; } this.length++; }; this.leftOut=function () { for(var i=0; i<this.length-1;i++){ arr[i] = arr[i+1]; } this.length--; }; this.size=function () { return this.length; }; //index是数组下标 this.remove=function (index) { for(var i=index; i<this.length-1;i++){ arr[i] = arr[i+1]; } this.length--; }; } //定义一个利用dom画图的方法 传入参数"+" 增加一个正方形 传入一个"-" 减少一个正方形 function draw(what) { if(what=="+"){ var div_add = document.createElement("div"); show.appendChild(div_add); }else{ var div_del =show.getElementsByTagName("div")[0]; show.removeChild(div_del); } } //定义一个函数 将数组的值传入每个div中 function assignNum() { var divs =show.getElementsByTagName("div"); for(var i =0;i<divs.length;i++){ divs[i].firstChild.nodeValue = myarr[i].toString(); } } </script> </body> </html> ```
关于ajax中发送不到servlet的问题
## 最近在学ajax,看到教材的这个案例,然后就是实现搜索框文本框输入提示的问题,然后就在js中那个display的函数中就直接执行alert语句,在servlet中加了一个输出语句,然后发现send函数也发送不到servlet有没有大佬知道这个怎么整啊,求 ``` <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>search Suggest</title> <script type="text/javascript" src="/ElJstlAjax/js/ajax.js"></script> <script type="text/javascript"> var trSrc; function search() { var inputWord = document.getElementById("inputWord").value; if(inputWord ==""){ clearDivData(); return; } var url = "SearchSuggest"; var params = "inputWord="+inputWord; sendRequest(url,params,"POST",display); } function display() { //alert(httpRequest.readyState+" "+httpRequest.status); if(httpRequest.readyState == 4){ if(httpRequest.status == 200){ var xmlDoc = httpRequest.responseXML; clearDivData(); changeDivData(xmlDoc); }else{ alert("您请求的界面有异常!"); } } } // 清除下拉框中的数据 function clearDivData(){ var tbody = document.getElementById("wordsListTbody"); var trs = tbody.getElementsByTagName("tr"); for(var i=trs.length-1;i>0;i--){ tbody.removeChild(trs[i]); } } // 设置用户选中条目的背景色 function setBgColor() { if(trSrc){ trSrc.style.backgroundColor = "white"; } trSrc = event.srcElement; trSrc.style.backgroundColor = "gray"; } // 将用户选中的条目显示在文本框中 function setText(){ alert("setText"); document.getElementById("inputWorld").value = trSrc.firstChild.data; document.getElementById("wordsListDiv").style.visibility = "hidden"; } // 实际将数据加入下拉提示框 function changeDivData(xmlDoc) { alert("changeDiv"); var words = xmlDoc.getElementsByTagName("word"); var tbody = document.getElementById("wordsListTbody"); for(i=0;i<words.length;i++){ var newTr = document.createElement("tr"); var newCell = document.createElement("td"); var wordText = words[i].firstChild.data; var textNode = document.createTextNode(wordText); newCell.onmouseover = setBgColor; newCell.onclick = setText; newCell.appendChild(textNode); newTr.append(newCell); tbody.appendChild(newTr); } if(words.length>0){ document.getElementById("wordsListDiv").style.visibility = 'visible'; }else{ document.getElementById("wordsListDiv").style.visibility = 'hidden'; } } //设置下拉提示框的位置 function setDivPosition() { var input = document.getElementById("inputWord"); var listdiv = document.getElementById("wordsListDiv"); listdiv.style.left = (input.offsetLeft)+"px"; listdiv.style.border = "blue 1px solid"; listdiv.style.top = (input.offsetTop+input.offsetHeight)+"px"; listdiv.style.width = (input.offsetWidth)+"px"; } </script> </head> <body onload="setDivPosition()"> <p>搜索字符串:<input type="text" id="inputWord" onkeyup="search()"></p> <div id="wordsListDiv" style="position:absolute;visibility:hidden"> <table id="worksListTable"> <tbody id="wordsListTbody"><tr><td>test</td></tr></tbody> </table> </div> </body> </html> ``` ## 下面一个实例就能正常运行 ``` <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>表单验证</title> <script type="text/javascript" src="js/ajax.js"></script> <script type="text/javascript"> function formcheck() { var url = "FormCheck"; var params = "userid="+userid.value+"&userpwd="+userpwd.value; sendRequest(url,params,"POST",showresult); } function showresult() { if(httpRequest.readyState == 4){ if(httpRequest.status == 200){ var info =httpRequest.responseText; result.innerHTML=info; } } } </script> </head> <body> <div id="inp"> 请输入用户名:<input type="text" name="userid" onblur="formcheck()"><br> 请输入密码:<input type="password" name=userpwd><br> <input type="button" value="登陆" onclick="formcheck()"> </div> <div id="result"></div> </body> </html> ``` ![图片说明](https://img-ask.csdn.net/upload/201909/21/1569031179_633416.png)
关于js函数调用不起作用的问题
今天在学习ajax的时候,按照课本上的步骤,但是最后没有任何效果 ``` <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>search Suggest</title> <script type="text/javascript" src="/js/ajax.js"></script> <script type="text/javascript"> var trSrc; //设置下拉提示框的位置 function setDivPosition() { alert("error"); var input = document.getElementById("inputWord"); var listdiv = document.getElementById("wordsListDiv"); listdiv.style.left = (input.offsetLeft)+"px"; listdiv.style.border = "blue 1px solid"; listdiv.style.top = (input.offsetTop+input.offsetHeight)+"px"; listdiv.style.width = (input.offsetWidth)+"px"; } function search() { alert("search?"); var inputWord = document.getElementById("inputWord").value; var url = "SearchSuggest"; var params = "inputWord="+inputWord; sendRequest(url,params,"POST",display); } function display() { alert("display?"); if(httpRequest.readyState == 4){ if(httpRequest.status == 200){ var xmlDoc = httpRequest.responseXML; clearDivData(); changeDivData(xmlDoc); }else{ alert("您请求的界面有异常!"); } } } // 清除下拉框中的数据 function clearDivData(){ alert("clearDiv"); var tbody = document.getElementById("wordsListTbody"); vat trs = tbody.getElementsByTagName("tr"); for(var i=trs.length-1;i>0;i--){ tbody.removeChild(trs[i]); } } // 设置用户选中条目的背景色 function setBgColor() { if(trSrc){ trSrc.style.backgroundColor = "white"; } trSrc = event.srcElement; trSrc.style.backgroundColor = "gray"; } // 将用户选中的条目显示在文本框中 function setText(){ alert("setText"); document.getElementById("inputWorld").value = trSrc.firstChild.data; document.getElementById("wordsListDiv").style.visibility = "hidden"; } // 实际将数据加入下拉提示框 function changeDivData(xmlDoc) { alert("changeDiv"); var words = xmlDoc.getElementsByTagName("word"); var tbody = document.getElementById("wordsListTbody"); for(i=0;i<words.length;i++){ var newTr = document.createElement("tr"); var newCell = document.createElement("td"); var wordText = words[i].firstChild.data; var textNode = document.createTextNode(wordText); newCell.onmouseover = setBgColor; newCell.onclick = setText; newCell.appendChild(textNode); newTr.append(newCell); tbody.appendChild(newTr); } if(words.length>0){ document.getElementById("wordsListDiv").style.visibility = 'visible'; }else{ document.getElementById("wordsListDiv").style.visibility = 'hidden'; } } </script> </head> <body onload="setDivPosition()"> <p>搜索字符串:<input type="text" id="inputWord" onkeyup="search()"></p> <div id="wordsListDiv" style="position:absolute;visibility:hidden"> <table id="worksListTable"> <tbody id="wordsListTbody"><tr><td>test</td></tr></tbody> </table> </div> </body> </html> ``` 其中就是body标签调用的onload,然后文本框调用了onKeyUp,在两个函数里面都加了一条alert语句,然后运行的时候还是什么反应都没有,求大佬给看一下是什么原因
indexedDB中的游标continue()函数不能正常执行
``` <!DOCTYPE html> <html> <head> <!-- 改进的地方: 模块化 增加时间、地点 为每一条留言增加:编辑、删除 使可以输入表情、图片等 点击提交留言不会添加“说” 添加登录注册 --> <meta charset="utf-8"></meta> <script> var db; var arrayKey=[] var openRequest; var lastCursor; var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.msIndexedDB; function init() { //打开数据库 openRequest = indexedDB.open("messageIndexDB"); //只能在onupgradeneeded创建对象存储空间 openRequest.onupgradeneeded = function(e) { //console.log("running onupgradeneeded"); var thisDb = e.target.result;//获取数据库实例 if(!thisDb.objectStoreNames.contains("messageIndexDB")) { console.log("I need to create the objectstore"); /* *创建对象存储空间,第一个参数必须和打开数据库的第一个参数一致 *设置键名是id,并且可以自增. *autoIncrement默认是false,keyPath默认null */ var objectStore = thisDb.createObjectStore("messageIndexDB", { keyPath: "id", autoIncrement:true }); /* *创建索引 *第一个参数是索引名,第二个是作为索引的属性名,第三个设置索引特性 */ objectStore.createIndex("name", "name", { unique: false }); } } openRequest.onsuccess = function(e) { //e.target.result返回一个数据库实例 db = e.target.result; db.onerror = function(event) { alert("数据库错误: " + event.target.errorCode); console.dir(event.target); }; if(db.objectStoreNames.contains("messageIndexDB")) { console.log("contains messageIndexDB"); //读写方式开启事务 var transaction = db.transaction(["messageIndexDB"],"readwrite"); transaction.oncomplete = function(event) { // console.log("All done!"); }; transaction.onerror = function(event) { // 错误处理 console.dir(event); }; //var content= document.querySelector("#content"); //得到messageIndexDB的objectStore对象 var objectStore = transaction.objectStore("messageIndexDB"); //游标查询 objectStore.openCursor().onsuccess = function(event) { //event.target.result获取存储空间的下一个对象 var cursor = event.target.result; var flag=0;// //判断是否存在下一个对象,不存在是curson为null if (cursor) { console.log(cursor.key); //获取键 console.dir(cursor.value); //实际对象,一个Object实例 var msgList= document.querySelector("#messageList"); var msgDiv=document.createElement("div"); var msgTxt = document.createTextNode(cursor.value[flag]["name"]+"说:"+cursor.value[flag]["content"]); msgDiv.id=cursor.key; msgDiv.appendChild(msgTxt); msgList.appendChild(msgDiv); arrayKey.push(cursor.key); flag++; lastCursor=cursor.key;//记录当前游标的上一个游标 cursor.continue(); //将游标下移一项 } else { console.log("Done with cursor"); } }; //错误处理 objectStore.openCursor().onerror=function(event){ console.dir(event); }; } }; openRequest.onerror = function (event) { // 对request.error做一些需要的处理! console.log("your web may not support IndexedDB,please check."); }; //焦点处理 document.querySelector("#message").addEventListener("focus",function() { this.value = ""; }); document.querySelector("#name").addEventListener("focus",function() { this.value = ""; }); //添加数据 document.querySelector("#btn1").addEventListener("click", function() { var content=document.querySelector("#message").value; var name=document.querySelector("#name").value; /*var address=document.querySelector("#address").value;*/ var messageIndexDB=[{"name":name,"content":content}];//这里的nessageIndexDB和数据库的名字的区别是一个是变量,一个是字符串(使用时都是用引号引起来的) var transaction = db.transaction(["messageIndexDB"], "readwrite"); transaction.oncomplete = function(event) { // console.log("transaction complete"); }; transaction.onerror = function(event) { console.dir(event); }; //得到messageIndexDB的objectStore对象 var objectStore = transaction.objectStore("messageIndexDB"); objectStore.add(messageIndexDB); objectStore.openCursor().onsuccess = function(event) { cursor = event.target.result; console.log(cursor.key); var key; if(lastCursor==null) { key=cursor.key; lastCursor=key; console.log("这里是lastCursor==null"+key+" "+lastCursor); } else { key=++lastCursor;//全局变量,所以每次点击按钮都是接着上一次的值 console.log("这里是lastCursor不是null"+key+" "+lastCursor); } /*console.log("这里是改造后的");//这样不行,因为cursor.key在每次点击按钮时都会从第一个cursor开始 key = cursor.key; cursor.continue();*/ var msgList= document.querySelector("#messageList"); var msgDiv=document.createElement("div"); msgDiv.id=key; var msgTxt = document.createTextNode(name+"说:"+content); msgDiv.appendChild(msgTxt); msgList.appendChild(msgDiv); arrayKey.push(key); console.log("success add new record!key:"+key); console.dir(messageIndexDB); // cursor.continue(); } }); //删除 document.querySelector("#delete").addEventListener("click", function() { if(arrayKey.length==0){ console.log("no data to delete!"); } else { var transaction = db.transaction(["messageIndexDB"], "readwrite"); transaction.oncomplete = function(event) { // console.log("transaction complete!"); }; transaction.onerror = function(event) { console.dir(event); }; //得到messageIndexDB的objectStore对象 var objectStore = transaction.objectStore("messageIndexDB"); var removeKey=arrayKey.shift(); //获取key var getRequest=objectStore.get(removeKey); getRequest.onsuccess=function(e) { var result =getRequest.result; console.dir(result); } //删除key var request=objectStore.delete(removeKey); request.onsuccess = function(e) { console.log("success delete record!"); }; request.onerror = function(e) { console.log("Error delete record:", e); }; //隐藏要删除的元素 document.getElementById(removeKey).style.display="none"; } }); } window.addEventListener("DOMContentLoaded", init, false); </script> <style type="text/css"> body{ font-size: 20px; -webkit-text-size-adjust:none; } </style> </head> <body> <h1>简单留言板(js+IndexedDB数据库实现)</h1> <form> 昵称:<input id="name" type="text" name="name"><br> 内容:<textarea id="message" rows="3" cols="20"></textarea><br> <input id="btn1" type="button" value="提交留言" /> <input id="delete" type="button" value="删除留言" /> </form> <br> <p1>留言列表</p1> <div id="messageList"></div> </body> </html> ``` 我在单步执行 ``` //游标查询 objectStore.openCursor().onsuccess = function(event) { //event.target.result获取存储空间的下一个对象 var cursor = event.target.result; var flag=0;// //判断是否存在下一个对象,不存在是curson为null if (cursor) { console.log(cursor.key); //获取键 console.dir(cursor.value); //实际对象,一个Object实例 var msgList= document.querySelector("#messageList"); var msgDiv=document.createElement("div"); var msgTxt = document.createTextNode(cursor.value[flag]["name"]+"说:"+cursor.value[flag]["content"]); msgDiv.id=cursor.key; msgDiv.appendChild(msgTxt); msgList.appendChild(msgDiv); arrayKey.push(cursor.key); flag++; lastCursor=cursor.key;//记录当前游标的上一个游标 cursor.continue(); //将游标下移一项 } else { console.log("Done with cursor"); } }; ``` 这段代码的时候,continue不能正常运行是怎么回事呀,有时候第一次f11,游标直接移动到最后 ,有时候会出现事务已经结束,从而continue不能正常执行
请教JS兼容性问题
这文件在IE下可以运行,在FF下不能,JS不兼容,那位有空的请帮我改下,谢谢 [code="java"]<html> <head> <title>JS内嵌表格</title> <script type="text/javascript"> var gseq=1; var gLastDetailImgObj=null; //显示详细信息 function showDetailNumTable(){ var innerTR = "<table border=\"1\" align='center' width='100%'><tr style=\"background:gray;\"><td>inner11</td><td>inner12</td><td>inner13</td><td>inner14</td><td>inner15</td></tr><tr><td>inner21</td><td>inner22</td><td>inner23</td><td>inner24</td><td>inner25</td></tr><tr><td>inner31</td><td>inner32</td><td>inner33</td><td>inner34</td><td>inner35</td></tr><tr><td>inner41</td><td>inner42</td><td>inner43</td><td>inner44</td><td>inner45</td></tr></table>"; var imgObj=event.srcElement; var tr=getOuterObj(imgObj,'TR'); // 得到tr对象 var newDivId=null; if(!tr.newDivId){ var newTr=document.createElement("<TR></TR>"); // 创建tr var newTd=document.createElement("<TD COLSPAN='"+tr.children.length+"' bgcolor='#F2F09F'></TD>"); // 创建td newDivId='detaildiv'+(gseq++); // 每一行内嵌的divID,每一行的ID都不同 var newDiv=document.createElement("<div id='"+newDivId+"'></div>"); // 创建div newTr.appendChild(newTd); // tr中添加td newTd.appendChild(document.createTextNode("各地区情况对比如下: ")); newDiv.innerHTML = innerTR; // 必须通过innerHTML方式添加内容,通过字符串拼进去的现实不出内容 newTd.appendChild(newDiv); // td中添加div tr.parentNode.insertBefore(newTr,tr.nextSibling); // 必须通过tr的父节点才能用insertBefore,表示插入某个元素,这里表示在tr下个元素的前面(tr的后面)插入一行 tr.newDivId=newDivId; // 把新生成的div的ID赋给DIV } switchVisible(imgObj); // 控制展开还是合上内嵌表格 if(gLastDetailImgObj!=imgObj){ switchVisible(gLastDetailImgObj); gLastDetailImgObj=imgObj; } else{ gLastDetailImgObj=null; } } function switchVisible(imgObj){ if(!imgObj) return; // 如果imgObj对象为空,则返回 var tr=getOuterObj(imgObj,'TR'); var pvisible=('true'!=tr.currentVisibility); tr.currentVisibility=(pvisible?'true':'false'); // pvisible为真时,tr.currentVisibility为true;pvisible为假时,tr.currentVisibility为false; tr.nextSibling.style.display=(pvisible? '':'none'); // pvisible为真时,tr.nextSibling.style.display为'';pvisible为假时,tr.nextSibling.style.display为none; } //取得对象外围符合指定标签的第一个对象 function getOuterObj(obj,tagName){ while(obj!=null){ if(obj.tagName==tagName) return obj; obj=obj.parentNode; } return null; } </script> </head> <body> <table border="1" align="center" width="80%"> <thead> <tr style="background:GRAY;"> <th>姓名</th><th>年龄</th><th>电话</th><th>性别</th><th>住址</th> </tr> </thead> <tbody> <tr> <td>1</td><td id = "no1"><a href="#" onclick="showDetailNumTable('no1');">11111111</a></td><td>1</td><td>1</td><td>1</td> </tr> <tr> <td>2</td><td id = "no2"><a href="#" onclick="showDetailNumTable('no2');">22222222</a></td><td>2</td><td>2</td><td>2</td> </tr> <tr> <td>3</td><td id = "no3"><a href="#" onclick="showDetailNumTable('no3');">33333333</a></td><td>3</td><td>3</td><td>3</td> </tr> <tr> <td>4</td><td id = "no4"><a href="#" onclick="showDetailNumTable('no4');">44444444</a></td><td>4</td><td>4</td><td>4</td> </tr> </tbody> </table> </body> </html> 将上面的代码保存为html格式后就能看到效果 [/code]
提交FCK编辑器中带有样式的内容时 怎么将样式导入
<p> </p> <p> </p> <p><strong><span style="font-size: medium;">代码中红色的部分都涉及到FCK,FCK的编辑内容 <span style="color: #ff0000;">${emailContent} 是包含有样式的html 页面,当把这个html的样式写到本页面时,编辑时,始终没有效果,本人对FCK的原理及其路径结构不清楚,望哪位大侠能 帮小弟解决一下:让FCK在编辑html页面时能看到自己定义的样式效果,并且能随之通过邮件发送出去,让收件人也看到同样的效果。(我曾将样式作为字符串在后台拼凑到内容中,但接收邮件还是没有样式的效果),</span></span></strong></p> <p><strong><span style="font-size: medium; color: #ff0000;">期待各位大侠赐招。</span></strong></p> <p> &lt;%@ page contentType="text/html;charset=GBK"%&gt;<br>&lt;%@ page language="java" %&gt;<br>&lt;%@ taglib uri="/tags/struts-html" prefix="html" %&gt;<br>&lt;%@ taglib uri="/tags/struts-bean" prefix="bean" %&gt;<br>&lt;%@ taglib uri="/tags/struts-logic" prefix="logic" %&gt;  <br>&lt;html&gt;<br>&lt;html:base/&gt;<br>&lt;head&gt;<br>&lt;meta http-equiv="Content-Type" content="text/html; charset=GBK"&gt;<br>&lt;!--标题--&gt;<br>&lt;object  id="factory"  style="display:none"  viewastext  classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"  codebase="<a href="http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360%22&gt;&lt;/object">http://www.meadroid.com/scriptx/ScriptX.cab#Version=5,60,0,360"&gt;&lt;/object</a>&gt;  <br>&lt;object id=hh2 classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11"&gt; &lt;param name="Command" value="Maximize"&gt;&lt;/object&gt;<br>&lt;title&gt;&lt;/title&gt;<br>&lt;!--样式表--&gt;<br>&lt;link href="../../../../${cssPath}/styleprint.css" rel="stylesheet" type="text/css"&gt;<br>&lt;script src="../../../../js/print.js"&gt;&lt;/script&gt; <br>&lt;script language=javascript src="${contextPath}/pages/js/System.js"&gt;&lt;/script&gt;<br>&lt;script language=javascript src="${contextPath}/pages/js/JsPublicUtils.js"&gt;&lt;/script&gt; <br>&lt;script language=javascript src="${contextPath}/pages/js/JsAjax.js"&gt;&lt;/script&gt;<br>&lt;script language=javascript src="${contextPath}/pages/js/DbEngine.js"&gt;&lt;/script&gt;<br>&lt;script language=javascript src="${contextPath}/pages/js/DateUtil.js"&gt;&lt;/script&gt;</p> <p>&lt;script language="javascript" src="${contextPath}/pages/js/JsTable.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript" src="${contextPath}/pages/js/JsPublicUtils.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript" src="${contextPath}/pages/js/calendar.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript" src="${contextPath}/pages/js/GetYearMonth.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript" src="${contextPath}/pages/js/JsValidateUtils.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript" src="${contextPath}/pages/js/JsMultiSelectComp.js"&gt;&lt;/script&gt;<br>&lt;link href="../../../../${cssPath}/default.css"  rel="stylesheet" type="text/css"&gt;<br>&lt;link href="../../../../${cssPath}/stylelist.css" rel="stylesheet" type="text/css"&gt; <br>&lt;link href="../../../../${cssPath}/sysstyle.css" rel="stylesheet" type="text/css"&gt;<br> &lt;style type="text/css"&gt;<br> .txtBox {<br> border: 1px solid #DBEAF5;<br> font-size: 12px;<br>}<br>.bgbian {<br> background-color: #1b5ba5;<br> padding-bottom: 1px;<br> padding-right: 1px;</p> <p>}.bgwhiteleft{<br> text-align: left;<br> background-color: #FFFFFF;<br> overflow:hidden;<br>}<br>.bgwhiteright{<br> text-align: right;<br> background-color: #FFFFFF;</p> <p>}<br> &lt;/style&gt;<br> &lt;script type="text/javascript" src="${contextPath}/pages/js/fckeditor/fckeditor.js"&gt;&lt;/script&gt;<br>&lt;script language="javascript"&gt;<br> function load(){<br>   var tmpcon = document.getElementById("mainID").innerHTML;<br>    document.getElementById("content").value = tmpcon;<br>    }<br> window.onload = function(){ <br>    load();<br><span style="color: #ff0000;"> // Automatically calculates the editor base path based on the _samples directory.<br> // This is usefull only for these samples. A real application should use something like this:<br> // oFCKeditor.BasePath = '/fckeditor/' ; // '/fckeditor/' is the default value.<br> //var sBasePath = document.location.pathname.substring(0,document.location.pathname.lastIndexOf('_samples')) ;</span></p> <p><span style="color: #ff0000;"> var oFCKeditor = new FCKeditor( 'content',"100%",500) ;<br> oFCKeditor.BasePath = "${contextPath}/pages/js/fckeditor/" ;<br> oFCKeditor.ToolbarSet = "Default" ;<br> oFCKeditor.ReplaceTextarea() ;<br>}</span><br>&lt;/script&gt;</p> <p> &lt;script language="javascript"&gt;<br>  function checkForm() {<br>  var con=true;<br>  if(document.all.mailAddress.value.trim()==""){<br>  alert("请输入发件人");<br>  con=false;<br>  document.all.mailAddress.focus();<br>  }<br>  else if(document.all.password.value.trim()==""){<br>   alert("请输入发件人邮箱密码");<br>  con=false;<br>  document.all.password.focus();<br>  }<br>  else if(document.all.receiveAddress.value.trim()==""){<br>  alert("请输入收件人");<br>  con=false;<br>   document.all.receiveAddress.focus();<br>  }else{<br>  con=true;<br>  }<br>  return con;<br>  document.all.submitBtn.disabled= false;<br>  }<br> <br>  function checkEmailAddress(temp){  <br>   var receiveAddress = document.all.receiveAddress.value; <br>   var o;<br>   if(temp=="mailAddress"){<br>    receiveAddress = document.all.mailAddress.value;<br>    o="发件人";<br>   }else{<br>    receiveAddress = document.all.receiveAddress.value;<br>    o="收件人";<br>   }<br>   var mailAdds = receiveAddress.split(";");<br> for(var i=0;i&lt;mailAdds.length;i++){<br>  if(mailAdds[i]=="") continue;<br>  var result = validateLib.checkEmail(mailAdds[i]);<br>  if(!result){<br>   alert(o+"的email地址错误!");<br>  if(temp=="mailAddress"){<br>     document.all.mailAddress.focus();<br>    }else{<br>     document.all.receiveAddress.focus();<br>    }<br>   return false;<br>  }<br> }<br>  }<br>  function removeDtlRow(node) {<br> node.removeNode(true);<br> tableLib.setTableRowIndex("tableRowNum"); <br>}<br>function addAttachment(){<br> var container = document.getElementById("attachmentTable");<br> var tBody = container.firstChild;<br> var trNode = document.createElement("tr");<br> trNode.className = "bgwhiteleft";<br> trNode.setAttribute("class","bgwhiteleft");<br> var tdNode = document.createElement("td");<br> var fileNode = document.createElement("input");<br> var fileNum = getFileNum(container);<br> fileNode.setAttribute("type","file");<br> fileNode.name ="uploadFile["+fileNum+"].file"; <br> fileNode.className = "txtBox";<br> fileNode.setAttribute("class","txtBox");<br> var btnNode = document.createElement('&lt;input type="button" onClick="removeDtlRow(this.parentNode.parentNode)" value="删除" class="buttonstyle" /&gt;');  <br> tdNode.appendChild(fileNode);<br> tdNode.appendChild(btnNode);<br> trNode.appendChild(tdNode);<br> tBody.appendChild(trNode); <br>}<br>function getFileNum(container){<br> var inputNodes = container.getElementsByTagName("input");<br> var fileNum = 0;<br> for(var i=0;i&lt;inputNodes.length;i++){<br>  if(inputNodes[i].type=="file")<br>   fileNum++;<br> }<br> return fileNum;<br>}<br>function checkAttachment(container){<br> var inputNodes = container.getElementsByTagName("input");  <br> for(var i=0;i&lt;inputNodes.length;i++){<br>  if(inputNodes[i].type=="file"){   <br>   if(inputNodes[i].value ==""){<br>    return false;<br>   }<br>  }<br> }<br> return true;<br>}<br>&lt;/script&gt;</p> <p>&lt;/head&gt;<br>&lt;body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" bgcolor="#B7CCE7"&gt;<br>&lt;html:form action="/msg/sendMail.do" onsubmit="return checkForm();" enctype="multipart/form-data" &gt;</p> <p>   &lt;div  align="center" style="width:90%;left:200; height:800px; margin:0 auto;position:absolute; left:75; top:50; "&gt;<br>         &lt;table width="100%" border="0" cellspacing="1" cellpadding="1" class="bgbian"&gt;<br>          &lt;tr class="bgwhiteleft"&gt;<br>                  &lt;td nowrap="nowrap" width="3%" colspan="2" align="center"&gt;&lt;font color="#36A9D2" size="5"&gt;&lt;b&gt;邮发界面&lt;b&gt;&lt;/font&gt;&lt;/td&gt;<br>                  &lt;/td&gt;<br>                &lt;/tr&gt;  <br>                &lt;tr class="bgwhiteleft"&gt;<br>                  &lt;td nowrap="nowrap" width="3%"&gt;发件人:&lt;/td&gt;<br>                  &lt;td nowrap="nowrap"&gt;&lt;input type="text" name="mailAddress" value="" onblur="return checkEmailAddress('mailAddress');"&gt;&lt;font color="#36A9D2" size="2"&gt;(限于126,163,yeah.net等网易邮箱)&lt;/font&gt;<br>                  &lt;/td&gt;<br>                &lt;/tr&gt;  <br>                &lt;tr class="bgwhiteleft"&gt;<br>                  &lt;td nowrap="nowrap"&gt;密&amp;nbsp;&amp;nbsp;码:&lt;/td&gt;<br>                  &lt;td nowrap="nowrap"&gt;<br>                  &lt;input type="password" name="password" value=""&gt;<br>                  &lt;/td&gt;<br>                &lt;/tr&gt;  <br>                &lt;tr class="bgwhiteleft"&gt;<br>                  &lt;td nowrap="nowrap"&gt;标&amp;nbsp;&amp;nbsp;题:&lt;/td&gt;<br>                  &lt;td nowrap="nowrap"&gt;&lt;html:text property="subject" styleClass="txtBox" size="80"/&gt;&lt;/td&gt;<br>                &lt;/tr&gt;<br>                &lt;tr class="bgwhiteleft"&gt;<br>                  &lt;td nowrap="nowrap"&gt;收件人:&lt;/td&gt;<br>                  &lt;td nowrap="nowrap"&gt;&lt;html:textarea property="receiveAddress" styleClass="txtBox" rows="2" style="width:40%"  onblur="return checkEmailAddress('mailAddress');" /&gt;&lt;font color="#36A9D2" size="2"&gt;(多用户接收用分号";"隔开,如:a.@126.com;b.@126.com;...)&lt;/font&gt;&lt;/td&gt;<br>                &lt;/tr&gt;               <br>              &lt;/table&gt;<br>              &lt;table width="100%" border="0" cellspacing="1"   class="bgbian" &gt;<br>               &lt;tr class="bgwhiteleft"&gt;<br>                 <span style="color: #ff0000;">&lt;td nowrap="nowrap"&gt;&lt;html:textarea property="content" styleClass="txtBox" style="width:100%;" rows="25"/&gt;&lt;/td&gt;<br>                &lt;/tr&gt;</span><br>              &lt;/table&gt;<br>              <br>              <br>              &lt;table width="100%" border="0" cellspacing="1" cellpadding="1" class="bgbian" id="attachmentTable"&gt;<br>              &lt;/table&gt; <br>              <br>              <br>              &lt;table width="100%" border="0" cellspacing="1" cellpadding="1" class="bgbian"&gt;<br>                &lt;tr class="bgwhiteleft"&gt;<br>                 &lt;td nowrap="nowrap"&gt;附&amp;nbsp;&amp;nbsp;件:&lt;/td&gt;<br>                    &lt;td nowrap="nowrap"&gt;&lt;input type="button" value="添加附件" name="addBtn" class="buttonstyle" onClick="addAttachment();"/&gt;&lt;/td&gt;<br>                &lt;/tr&gt;<br>              &lt;/table&gt;<br>            <br> <span style="color: #ff0000;">  &lt;div id="mainID" style="display:none"&gt; ${emailContent}&lt;/div&gt; &lt;/td&gt;</span>         <br>              &lt;table width="100%" border="0" cellspacing="1"   class="bgbian"&gt;<br>                &lt;tr class="bgwhitecenter"&gt;<br>                  &lt;td&gt;&lt;html:submit property="submitBtn" styleClass="buttonstyle"  value="发送"  /&gt;<br>                    &amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;<br>                    &lt;html:button property="backBtn" styleClass="buttonstyle" onclick="history.back();" value="返回"/&gt;<br>                  &lt;/td&gt;<br>                &lt;/tr&gt;<br>              &lt;/table&gt;<br>              &lt;/td&gt;<br>  &lt;/tr&gt;<br>  &lt;/table&gt;<br>  &lt;/div&gt;<br>  </p> <p> &lt;!--页面信息1开始--&gt;<br> &lt;!--页面信息1开始--&gt;<br>    <br>            <br>              &lt;!--页面信息1结束--&gt;<br>              <br> <br>     <br>&lt;!--总表结束--&gt;<br>&lt;/html:form&gt;<br>&lt;/body&gt;</p> <p> </p> <p><strong><span style="font-size: medium;">红色的部分都涉及到FCK,FCK的编辑内容 <span style="color: #ff0000;">${emailContent} 是包含有样式的html 页面,当把这个html的样式写到本页面时,编辑时,始终没有效果,本人对FCK的原理及其路径结构不清楚,望哪位大侠能 帮小弟解决一下:让FCK在编辑html页面时能看到自己定义的样式效果,并且能随之通过邮件发送出去,让收件人也看到同样的效果。(我曾将样式作为字符串在后台拼凑到内容中,但接收邮件还是没有样式的效果),</span></span></strong></p> <p><strong><span style="font-size: medium; color: #ff0000;">期待各位大侠赐招。</span></strong></p> <p> </p> <p> </p>
关于模糊查询
<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage=""%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script language="javascript" type="text/javascript"> var xmlHttp; function createXMLHttpRequest(){ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else if(window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); } } //根据输入的内容进行关联查找 function search(){ createXMLHttpRequest(); var inputWord = document.getElementById('inputWord').value; var url="/AJAX/houtai.jsp?inputWord="+inputWord; xmlHttp.open("get",url,true); xmlHttp.onreadystatechange = display; xmlHttp.send(null); } //将服务器返回的数据列入下拉提示框中 function display(){ if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { var xmlDoc = xmlHttp.responseXML; clearDivData(); changeDivData(xmlDoc); document.getElementById('wordsListDiv').style.visibility='visible'; } } } //清除下拉提示框中已有的数据 function clearDivData(){ document.getElementById('wordsListTbody').innerHTML=''; } //实际将数据加入下拉提示框 function changeDivData(xmlDoc){ //alert(xmlDoc); var words = xmlDoc.childNodes[0].childNodes; var tbody = document.getElementById('wordsListTbody'); //alert(words[0].firstChild.nodeValue); for(i=0;i<words.length;i++){ var newTr = document.createElement('tr'); var newCell = document.createElement('td'); var text = words[i].firstChild.nodeType; var textNode = document.createTextNode(words[i].firstChild.data); newCell.appendChild(textNode); newTr.appendChild(newCell); tbody.appendChild(newTr); } HOUTAI.JSP <%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*,java.util.*" errorPage="" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> </head> <body> <% String inputWord= request.getParameter("inputWord"); HashMap map = new HashMap(); map.put("a","<words><word>a</word><word>ab</word><word>abc</word><word>abcd</word><word>abcde</word></words>"); map.put("ab","<words><word>ab</word><word>abc</word><word>abcd</word><word>abcde</word></words>"); map.put("abc","<words><word>abc</word><word>abcd</word><word>abcde</word></words>"); map.put("abcd","<words><word>abcd</word><word>abcde</word></words>"); map.put("abcde","<words><word>abcde</word></words>"); response.setContentType("text/xml;charset=gb2312"); if(!map.containsKey(inputWord)){ System.out.println("<words></words>"); out.println("<words></words>"); }else{ out.println(map.get(inputWord).toString()); } %> </body> </html> } //设置下拉提示框的位置 function setDivPosition(){ document.getElementById('wordsListDiv').style.left=document.getElementById('inputWord').offsetLeft+'px'; document.getElementById('wordsListDiv').style.border='black 1px solid'; document.getElementById('wordsListDiv').style.top= document.getElementById('inputWord').offsetTop+document.getElementById('inputWord').offsetHeight; document.getElementById('wordsListTable').style.width=document.getElementById('inputWord').offsetWidth+'px'; } </script> <body onload="setDivPosition()"> <p> 搜索字符串: <input type="text" id="inputWord" onKeyUp="search()"> <div id="wordsListDiv" style="position:absolute;visibility:hidden"> <table id="wordsListTable"> <tbody id="wordsListTbody"> <tr> <td> test </td> </tr> <tr> <td> test </td> </tr> <tr> <td> test </td> </tr> </tbody> </table> </div> <body> </html> 没有反应是哪里出问题了,帮忙指点下
相见恨晚的超实用网站
搞学习 知乎:www.zhihu.com 简答题:http://www.jiandati.com/ 网易公开课:https://open.163.com/ted/ 网易云课堂:https://study.163.com/ 中国大学MOOC:www.icourse163.org 网易云课堂:study.163.com 哔哩哔哩弹幕网:www.bilibili.com 我要自学网:www.51zxw
花了20分钟,给女朋友们写了一个web版群聊程序
参考博客 [1]https://www.byteslounge.com/tutorials/java-ee-html5-websocket-example
爬虫福利二 之 妹子图网MM批量下载
爬虫福利一:27报网MM批量下载    点击 看了本文,相信大家对爬虫一定会产生强烈的兴趣,激励自己去学习爬虫,在这里提前祝:大家学有所成! 目标网站:妹子图网 环境:Python3.x 相关第三方模块:requests、beautifulsoup4 Re:各位在测试时只需要将代码里的变量 path 指定为你当前系统要保存的路径,使用 python xxx.py 或IDE运行即可。
字节跳动视频编解码面经
引言 本文主要是记录一下面试字节跳动的经历。 三四月份投了字节跳动的实习(图形图像岗位),然后hr打电话过来问了一下会不会opengl,c++,shador,当时只会一点c++,其他两个都不会,也就直接被拒了。 七月初内推了字节跳动的提前批,因为内推没有具体的岗位,hr又打电话问要不要考虑一下图形图像岗,我说实习投过这个岗位不合适,不会opengl和shador,然后hr就说秋招更看重基础。我当时
Java学习的正确打开方式
在博主认为,对于入门级学习java的最佳学习方法莫过于视频+博客+书籍+总结,前三者博主将淋漓尽致地挥毫于这篇博客文章中,至于总结在于个人,实际上越到后面你会发现学习的最好方式就是阅读参考官方文档其次就是国内的书籍,博客次之,这又是一个层次了,这里暂时不提后面再谈。博主将为各位入门java保驾护航,各位只管冲鸭!!!上天是公平的,只要不辜负时间,时间自然不会辜负你。 何谓学习?博主所理解的学习,它
程序员必须掌握的核心算法有哪些?
由于我之前一直强调数据结构以及算法学习的重要性,所以就有一些读者经常问我,数据结构与算法应该要学习到哪个程度呢?,说实话,这个问题我不知道要怎么回答你,主要取决于你想学习到哪些程度,不过针对这个问题,我稍微总结一下我学过的算法知识点,以及我觉得值得学习的算法。这些算法与数据结构的学习大多数是零散的,并没有一本把他们全部覆盖的书籍。下面是我觉得值得学习的一些算法以及数据结构,当然,我也会整理一些看过
大学四年自学走来,这些私藏的实用工具/学习网站我贡献出来了
大学四年,看课本是不可能一直看课本的了,对于学习,特别是自学,善于搜索网上的一些资源来辅助,还是非常有必要的,下面我就把这几年私藏的各种资源,网站贡献出来给你们。主要有:电子书搜索、实用工具、在线视频学习网站、非视频学习网站、软件下载、面试/求职必备网站。 注意:文中提到的所有资源,文末我都给你整理好了,你们只管拿去,如果觉得不错,转发、分享就是最大的支持了。 一、电子书搜索 对于大部分程序员...
linux系列之常用运维命令整理笔录
本博客记录工作中需要的linux运维命令,大学时候开始接触linux,会一些基本操作,可是都没有整理起来,加上是做开发,不做运维,有些命令忘记了,所以现在整理成博客,当然vi,文件操作等就不介绍了,慢慢积累一些其它拓展的命令,博客不定时更新 顺便拉下票,我在参加csdn博客之星竞选,欢迎投票支持,每个QQ或者微信每天都可以投5票,扫二维码即可,http://m234140.nofollow.ax.
比特币原理详解
一、什么是比特币 比特币是一种电子货币,是一种基于密码学的货币,在2008年11月1日由中本聪发表比特币白皮书,文中提出了一种去中心化的电子记账系统,我们平时的电子现金是银行来记账,因为银行的背后是国家信用。去中心化电子记账系统是参与者共同记账。比特币可以防止主权危机、信用风险。其好处不多做赘述,这一层面介绍的文章很多,本文主要从更深层的技术原理角度进行介绍。 二、问题引入 假设现有4个人...
Python 基础(一):入门必备知识
目录1 标识符2 关键字3 引号4 编码5 输入输出6 缩进7 多行8 注释9 数据类型10 运算符10.1 常用运算符10.2 运算符优先级 1 标识符 标识符是编程时使用的名字,用于给变量、函数、语句块等命名,Python 中标识符由字母、数字、下划线组成,不能以数字开头,区分大小写。 以下划线开头的标识符有特殊含义,单下划线开头的标识符,如:_xxx ,表示不能直接访问的类属性,需通过类提供
这30个CSS选择器,你必须熟记(上)
关注前端达人,与你共同进步CSS的魅力就是让我们前端工程师像设计师一样进行网页的设计,我们能轻而易举的改变颜色、布局、制作出漂亮的影音效果等等,我们只需要改几行代码,不需...
国产开源API网关项目进入Apache孵化器:APISIX
点击蓝色“程序猿DD”关注我回复“资源”获取独家整理的学习资料!近日,又有一个开源项目加入了这个Java开源界大名鼎鼎的Apache基金会,开始进行孵化器。项目名称:AP...
程序员接私活怎样防止做完了不给钱?
首先跟大家说明一点,我们做 IT 类的外包开发,是非标品开发,所以很有可能在开发过程中会有这样那样的需求修改,而这种需求修改很容易造成扯皮,进而影响到费用支付,甚至出现做完了项目收不到钱的情况。 那么,怎么保证自己的薪酬安全呢? 我们在开工前,一定要做好一些证据方面的准备(也就是“讨薪”的理论依据),这其中最重要的就是需求文档和验收标准。一定要让需求方提供这两个文档资料作为开发的基础。之后开发
网页实现一个简单的音乐播放器(大佬别看。(⊙﹏⊙))
今天闲着无事,就想写点东西。然后听了下歌,就打算写个播放器。 于是乎用h5 audio的加上js简单的播放器完工了。 欢迎 改进 留言。 演示地点跳到演示地点 html代码如下`&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;music&lt;/title&gt; &lt;meta charset="utf-8"&gt
Python十大装B语法
Python 是一种代表简单思想的语言,其语法相对简单,很容易上手。不过,如果就此小视 Python 语法的精妙和深邃,那就大错特错了。本文精心筛选了最能展现 Python 语法之精妙的十个知识点,并附上详细的实例代码。如能在实战中融会贯通、灵活使用,必将使代码更为精炼、高效,同时也会极大提升代码B格,使之看上去更老练,读起来更优雅。 1. for - else 什么?不是 if 和 else 才
数据库优化 - SQL优化
前面一篇文章从实例的角度进行数据库优化,通过配置一些参数让数据库性能达到最优。但是一些“不好”的SQL也会导致数据库查询变慢,影响业务流程。本文从SQL角度进行数据库优化,提升SQL运行效率。 判断问题SQL 判断SQL是否有问题时可以通过两个表象进行判断: 系统级别表象 CPU消耗严重 IO等待严重 页面响应时间过长
2019年11月中国大陆编程语言排行榜
2019年11月2日,我统计了某招聘网站,获得有效程序员招聘数据9万条。针对招聘信息,提取编程语言关键字,并统计如下: 编程语言比例 rank pl_ percentage 1 java 33.62% 2 c/c++ 16.42% 3 c_sharp 12.82% 4 javascript 12.31% 5 python 7.93% 6 go 7.25% 7
通俗易懂地给女朋友讲:线程池的内部原理
餐厅的约会 餐盘在灯光的照耀下格外晶莹洁白,女朋友拿起红酒杯轻轻地抿了一小口,对我说:“经常听你说线程池,到底线程池到底是个什么原理?”我楞了一下,心里想女朋友今天是怎么了,怎么突然问出这么专业的问题,但做为一个专业人士在女朋友面前也不能露怯啊,想了一下便说:“我先给你讲讲我前同事老王的故事吧!” 大龄程序员老王 老王是一个已经北漂十多年的程序员,岁数大了,加班加不动了,升迁也无望,于是拿着手里
经典算法(5)杨辉三角
杨辉三角 是经典算法,这篇博客对它的算法思想进行了讲解,并有完整的代码实现。
编写Spring MVC控制器的14个技巧
本期目录 1.使用@Controller构造型 2.实现控制器接口 3.扩展AbstractController类 4.为处理程序方法指定URL映射 5.为处理程序方法指定HTTP请求方法 6.将请求参数映射到处理程序方法 7.返回模型和视图 8.将对象放入模型 9.处理程序方法中的重定向 10.处理表格提交和表格验证 11.处理文件上传 12.在控制器中自动装配业务类 ...
腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹?
昨天,有网友私信我,说去阿里面试,彻底的被打击到了。问了为什么网上大量使用ThreadLocal的源码都会加上private static?他被难住了,因为他从来都没有考虑过这个问题。无独有偶,今天笔者又发现有网友吐槽了一道腾讯的面试题,我们一起来看看。 腾讯算法面试题:64匹马8个跑道需要多少轮才能选出最快的四匹? 在互联网职场论坛,一名程序员发帖求助到。二面腾讯,其中一个算法题:64匹
面试官:你连RESTful都不知道我怎么敢要你?
面试官:了解RESTful吗? 我:听说过。 面试官:那什么是RESTful? 我:就是用起来很规范,挺好的 面试官:是RESTful挺好的,还是自我感觉挺好的 我:都挺好的。 面试官:… 把门关上。 我:… 要干嘛?先关上再说。 面试官:我说出去把门关上。 我:what ?,夺门而去 文章目录01 前言02 RESTful的来源03 RESTful6大原则1. C-S架构2. 无状态3.统一的接
求小姐姐抠图竟遭白眼?痛定思痛,我决定用 Python 自力更生!
点击蓝色“Python空间”关注我丫加个“星标”,每天一起快乐的学习大家好,我是 Rocky0429,一个刚恰完午饭,正在用刷网页浪费生命的蒟蒻...一堆堆无聊八卦信息的网页内容慢慢使我的双眼模糊,一个哈欠打出了三斤老泪,就在此时我看到了一张图片:是谁!是谁把我女朋友的照片放出来的!awsl!太好看了叭...等等,那个背景上的一堆鬼画符是什么鬼?!真是看不下去!叔叔婶婶能忍,隔壁老王的三姨妈的四表...
为啥国人偏爱Mybatis,而老外喜欢Hibernate/JPA呢?
关于SQL和ORM的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行了一番讨论,感触还是有一些,于是就有了今天这篇文。 声明:本文不会下关于Mybatis和JPA两个持久层框架哪个更好这样的结论。只是摆事实,讲道理,所以,请各位看官勿喷。 一、事件起因 关于Mybatis和JPA孰优孰劣的问题,争论已经很多年了。一直也没有结论,毕竟每个人的喜好和习惯是大不相同的。我也看
SQL-小白最佳入门sql查询一
不要偷偷的查询我的个人资料,即使你再喜欢我,也不要这样,真的不好;
项目中的if else太多了,该怎么重构?
介绍 最近跟着公司的大佬开发了一款IM系统,类似QQ和微信哈,就是聊天软件。我们有一部分业务逻辑是这样的 if (msgType = "文本") { // dosomething } else if(msgType = "图片") { // doshomething } else if(msgType = "视频") { // doshomething } else { // doshom...
致 Python 初学者
欢迎来到“Python进阶”专栏!来到这里的每一位同学,应该大致上学习了很多 Python 的基础知识,正在努力成长的过程中。在此期间,一定遇到了很多的困惑,对未来的学习方向感到迷茫。我非常理解你们所面临的处境。我从2007年开始接触 python 这门编程语言,从2009年开始单一使用 python 应对所有的开发工作,直至今天。回顾自己的学习过程,也曾经遇到过无数的困难,也曾经迷茫过、困惑过。开办这个专栏,正是为了帮助像我当年一样困惑的 Python 初学者走出困境、快速成长。希望我的经验能真正帮到你
“狗屁不通文章生成器”登顶GitHub热榜,分分钟写出万字形式主义大作
一、垃圾文字生成器介绍 最近在浏览GitHub的时候,发现了这样一个骨骼清奇的雷人项目,而且热度还特别高。 项目中文名:狗屁不通文章生成器 项目英文名:BullshitGenerator 根据作者的介绍,他是偶尔需要一些中文文字用于GUI开发时测试文本渲染,因此开发了这个废话生成器。但由于生成的废话实在是太过富于哲理,所以最近已经被小伙伴们给玩坏了。 他的文风可能是这样的: 你发现,...
程序员:我终于知道post和get的区别
是一个老生常谈的话题,然而随着不断的学习,对于以前的认识有很多误区,所以还是需要不断地总结的,学而时习之,不亦说乎
《程序人生》系列-这个程序员只用了20行代码就拿了冠军
你知道的越多,你不知道的越多 点赞再看,养成习惯GitHub上已经开源https://github.com/JavaFamily,有一线大厂面试点脑图,欢迎Star和完善 前言 这一期不算《吊打面试官》系列的,所有没前言我直接开始。 絮叨 本来应该是没有这期的,看过我上期的小伙伴应该是知道的嘛,双十一比较忙嘛,要值班又要去帮忙拍摄年会的视频素材,还得搞个程序员一天的Vlog,还要写BU...
加快推动区块链技术和产业创新发展,2019可信区块链峰会在京召开
11月8日,由中国信息通信研究院、中国通信标准化协会、中国互联网协会、可信区块链推进计划联合主办,科技行者协办的2019可信区块链峰会将在北京悠唐皇冠假日酒店开幕。   区块链技术被认为是继蒸汽机、电力、互联网之后,下一代颠覆性的核心技术。如果说蒸汽机释放了人类的生产力,电力解决了人类基本的生活需求,互联网彻底改变了信息传递的方式,区块链作为构造信任的技术有重要的价值。   1...
程序员把地府后台管理系统做出来了,还有3.0版本!12月7号最新消息:已在开发中有github地址
第一幕:缘起 听说阎王爷要做个生死簿后台管理系统,我们派去了一个程序员…… 996程序员做的梦: 第一场:团队招募 为了应对地府管理危机,阎王打算找“人”开发一套地府后台管理系统,于是就在地府总经办群中发了项目需求。 话说还是中国电信的信号好,地府都是满格,哈哈!!! 经常会有外行朋友问:看某网站做的不错,功能也简单,你帮忙做一下? 而这次,面对这样的需求,这个程序员...
网易云6亿用户音乐推荐算法
网易云音乐是音乐爱好者的集聚地,云音乐推荐系统致力于通过 AI 算法的落地,实现用户千人千面的个性化推荐,为用户带来不一样的听歌体验。 本次分享重点介绍 AI 算法在音乐推荐中的应用实践,以及在算法落地过程中遇到的挑战和解决方案。 将从如下两个部分展开: AI算法在音乐推荐中的应用 音乐场景下的 AI 思考 从 2013 年 4 月正式上线至今,网易云音乐平台持续提供着:乐屏社区、UGC...
【技巧总结】位运算装逼指南
位算法的效率有多快我就不说,不信你可以去用 10 亿个数据模拟一下,今天给大家讲一讲位运算的一些经典例子。不过,最重要的不是看懂了这些例子就好,而是要在以后多去运用位运算这些技巧,当然,采用位运算,也是可以装逼的,不信,你往下看。我会从最简单的讲起,一道比一道难度递增,不过居然是讲技巧,那么也不会太难,相信你分分钟看懂。 判断奇偶数 判断一个数是基于还是偶数,相信很多人都做过,一般的做法的代码如下...
【管理系统课程设计】美少女手把手教你后台管理
【文章后台管理系统】URL设计与建模分析+项目源码+运行界面 栏目管理、文章列表、用户管理、角色管理、权限管理模块(文章最后附有源码) 1. 这是一个什么系统? 1.1 学习后台管理系统的原因 随着时代的变迁,现如今各大云服务平台横空出世,市面上有许多如学生信息系统、图书阅读系统、停车场管理系统等的管理系统,而本人家里就有人在用烟草销售系统,直接在网上完成挑选、购买与提交收货点,方便又快捷。 试想,若没有烟草销售系统,本人家人想要购买烟草,还要独自前往药...
8年经验面试官详解 Java 面试秘诀
作者 |胡书敏 责编 | 刘静 出品 | CSDN(ID:CSDNnews) 本人目前在一家知名外企担任架构师,而且最近八年来,在多家外企和互联网公司担任Java技术面试官,前后累计面试了有两三百位候选人。在本文里,就将结合本人的面试经验,针对Java初学者、Java初级开发和Java开发,给出若干准备简历和准备面试的建议。 Java程序员准备和投递简历的实...
面试官如何考察你的思维方式?
1.两种思维方式在求职面试中,经常会考察这种问题:北京有多少量特斯拉汽车?某胡同口的煎饼摊一年能卖出多少个煎饼?深圳有多少个产品经理?一辆公交车里能装下多少个乒乓球?一个正常成年人有多少根头发?这类估算问题,被称为费米问题,是以科学家费米命名的。为什么面试会问这种问题呢?这类问题能把两类人清楚地区分出来。一类是具有文科思维的人,擅长赞叹和模糊想象,它主要依靠的是人的第一反应和直觉,比如小孩...
碎片化的时代,如何学习
今天周末,和大家聊聊学习这件事情。 在如今这个社会,我们的时间被各类 APP 撕的粉碎。 刷知乎、刷微博、刷朋友圈; 看论坛、看博客、看公号; 等等形形色色的信息和知识获取方式一个都不错过。 貌似学了很多,但是却感觉没什么用。 要解决上面这些问题,首先要分清楚一点,什么是信息,什么是知识。 那什么是信息呢? 你一切听到的、看到的,都是信息,比如微博上的明星出轨、微信中的表情大战、抖音上的...
so easy! 10行代码写个"狗屁不通"文章生成器
前几天,GitHub 有个开源项目特别火,只要输入标题就可以生成一篇长长的文章。 背后实现代码一定很复杂吧,里面一定有很多高深莫测的机器学习等复杂算法 不过,当我看了源代码之后 这程序不到50行 尽管我有多年的Python经验,但我竟然一时也没有看懂 当然啦,原作者也说了,这个代码也是在无聊中诞生的,平时撸码是不写中文变量名的, 中文...
相关热词 如何提升c#开发能力 矩阵乘法c# c#调用谷歌浏览器 c# 去空格去转义符 c#用户登录窗体代码 c# 流 c# linux 可视化 c# mvc 返回图片 c# 像素空间 c# 日期 最后一天
立即提问