1.上传文件
用一个不透明度为0的 <input type="file" />盖在要用户可见的标签(或图片等)上,让用户点击。
用 width height line-height font-size 来控制<input type="file" />右侧浏览按钮的大小。 用 left top (right 、 bottum)来控制<input type="file" />右侧浏览按钮的位置,可以设置为负值。 用z-index来设置它们的层覆盖关系。 form 必须有enctype="multipart/form-data"标记才能上传文件 。2.jquery对象和dom对象的转换
$("#test").html() 意思是指:获取ID为test的元素内的html代码。其中html()是jQuery里的方法
这段代码等同于用DOM实现代码:
document.getElementById("id").innerHTML;jQuery对象转成DOM对象: 两种转换方式将一个jQuery对象转换成DOM对象:[index]和.get(index);
(1)jQuery对象是一个数据对象,可以通过[index]的方法,来得到相应的DOM对象。 如:var $v =$("#v") ; //jQuery对象 var v=$v[0]; //DOM对象 alert(v.checked) //检测这个checkbox是否被选中 (2)jQuery本身提供,通过.get(index)方法,得到相应的DOM对象 如:var $v=$("#v"); //jQuery对象 var v=$v.get(0); //DOM对象 alert(v.checked) //检测这个checkbox是否被选中 DOM对象转成jQuery对象: 对于已经是一个DOM对象,只需要用$()把DOM对象包装起来,就可以获得一个jQuery对象了。$(DOM对象) 如:var v=document.getElementById("v"); //DOM对象 var $v=$(v); //jQuery对象 转换后,就可以任意使用jQuery的方法了。 通过以上方法,可以任意的相互转换jQuery对象和DOM对象。需要再强调注意的是:DOM对象才能使用DOM中的方法,jQuery对象是不可以用DOM中的方法。 下面是其它的相关使用方法:1、DOM对象转jQuery对象 普通的Dom对象一般可以通过$()转换成jQuery对象。 如:$(document.getElementById("msg")) 返回的就是jQuery对象,可以使用jQuery的方法。 2、jQuery对象转DOM对象 由于jQuery对象本身是一个集合。所以如果jQuery对象要转换为Dom对象则必须取出其中的某一项,一般可通过索引取出。 如: $("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5] 这些都是Dom对象,可以使用Dom中的方法,但不能再使用jQuery的方法。 以下几种写法都是正确的: $("#msg").html(); $("#msg")[0].innerHTML; $("#msg").eq(0)[0].innerHTML; $("#msg").get(0).innerHTML;3.setInterval和setTimeout
因为setTimeout(表达式,延时时间)在执行时,是在载入后延迟指定时间后,去执行一次表达式,记住,次数是一次 而setInterval(表达式,交互时间)则不一样,它从载入后,每隔指定的时间就执行一次表达式 所以,完全是不一样的 很多人习惯于将setTimeout包含于被执行函数中,然后在函数外再次使用setTimeout来达到定时执行的目的 这样,函数外的setTimeout在执行函数时再次触发setTimeout从而形成周而复始的定时效果 4.slidedown和slideup jquery中向下滑动和向上滑动的效果 5.Math.random() 返回一个0-1的随机数。 6.tostring(16) (1)Array.toString():将数组转换成一个字符串,并且返回这个字符串。 (2)Boolean.toString():将布尔值转换为字符串。 (3)Date.toString():将Date对象转换成一个字符串,采用本地时间。 (4)Error.toString():将Error对象转换成字符串 (5)Function.toString():把函数转换成字符串 (6)Number.toString():将数字转换为字符串。用它的参数指定的基数或底数(底数范围为2-36)。如果省略参数,则使用基数10。当参数值为2时,返回二进制数。
<script type="text/javascript">
var a = 34; document.write(a.toString() + "<br />"); document.write(a.toString(2) + "<br />"); document.write(a.toString(8) + "<br />"); document.write(a.toString(16) + "<br />"); </script>7.ajax问题Ajax 应用程序所用到的基本技术: ·HTML 用于建立 Web 表单并确定应用程序其他部分使用的字段。 ·JavaScript 代码是运行 Ajax 应用程序的核心代码,帮助改进与服务器应用程序的通信。 ·DHTML 或 Dynamic HTML,用于动态更新表单。我们将使用 div、span 和其他动态 HTML 元素来标记 HTML。 ·文档对象模型 DOM 用于(通过 JavaScript 代码)处理 HTML 结构和(某些情况下)服务器返回的 XML。 1、从 Web 表单中获取需要的数据。 2、建立要连接的 URL。 3、打开到服务器的连接。 4、设置服务器在完成后要运行的函数。 5、发送请求。 清单 5 中的示例 Ajax 方法就是按照这个顺序组织的: 清单 5. 发出 Ajax 请求 function callServer() { // Get the city and state from the web form var city = document.getElementById("city").value; var state = document.getElementById("state").value; // Only go on if there are values for both fields if ((city == null) || (city == "")) return; if ((state == null) || (state == "")) return; // Build the URL to connect to var url = "/scripts/getZipCode.php?city=" + escape(city) + "&state=" + escape(state); // Open a connection to the server xmlHttp.open("GET", url, true); // Setup a function for the server to run when it's done xmlHttp.onreadystatechange = updatePage; // Send the request xmlHttp.send(null); } 清单 6. 处理服务器响应 function updatePage() { if (xmlHttp.readyState == 4) { var response = xmlHttp.responseText; document.getElementById("zipCode").value = response; } } 清单 7. 启动一个 Ajax 过程7.jquery的ajax
$(function(){ $('#send').click(function(){ $.ajax({ type: "GET", url: "test.json", data: {username:$("#username").val(), content:$("#content").val()}, dataType: "json", success: function(data){ $('#resText').empty(); //清空resText里面的所有内容 var html = ''; $.each(data, function(commentIndex, comment){ html += '
' + comment['username'] + ':