一、javaScript
1、prompt方法
主要用处是:显示提示对话框。
用法:prompt(message,defaulttext)
message 是提示信息
defaulttext 是要输入的值。也可以不输入值,如果不输入值,则返回null。
2、事件的监听
ie中事件的监听及删除
object.attachEvent("onclick",functionName)
object.detachEvent("onclick",functionName)
DOM规范的浏览器如:firefox
object.addEventListener("click",functionName,false);
object.removeEventListener("click",functionName,false);
//第三个参数false表示的是采用冒泡型事件 true为捕获型事件
ie浏览器中事件对象是window对象的一个属性event
object.onclick = function(){
var oEvent = window.event;
}
DOM中规定event对象必须作为唯一参数传给事件处理函数
object.onclick = function(oEvent){
//...
}
为了兼容浏览器,通常采用如下方法:
object.onclick = function(oEvent){
if(window.event) oEvent = window.event;
}
3、错误调试
window.onerror事件
try{}catch(exception){}语句,例
try{
//...
}catch(exception){
var sError = "";
for(var i in exception){
sError += i + ":" + exception[i] + "\n";
}
}
4、调试器
firefox错误控制台
Microsoft Script Debugger
5、表单控制
textarea输入字符个数的控制:
<textarea name="comments" id="comments" cols="50" rows="5" maxlength="50"
onkeypress="return LessThan(this);"></textarea>
<script>
function LessThan(oTextArea){
return oTextArea.value.length < oTextArea.getAttribute("maxlength");
}
</script>
二、css
div标记不同行---整体进行换行
span标记同一行---行内标记
z-index 空间坐标
三、dom
1、访问节点
getElementsByTagName
getElementById
四、ajax
创建异步对象
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject)
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
else if(window.XMLHttpRequest)
xmlHttp = new XMLHttpRequest();
}
建立请求
xmlHttp.open("GET",url,true)
第三个参数true表示异步交互
异步对象连接服务器
onreadystatechange事件
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4&&xmlHttp.status==200)
//...
}
send()发送
xmlHttp.send(null);
GET提交方式send(null)、POST方式send(requestURL)
五、jquery
注:引用jquery.js的连接必须放在其他js以用的上面
**属性选择器,jquery使用了XPath中的惯例来标识属性,即将属性前置一个@符号并放在一对方括号中。
例如,要选择所有带title属性的链接,可以使用下面的代码:
$('a[@title]')
此外,方括号在XPath语法中还有另外一种用途,即在不带前置@符号的情况下,可以用来指定包含
在另一个元素中的元素。例如,可以通过下面的选择符表达式,去的包含一个ol元素的所有div元素:
$('div[ol]')
1、事件操作
1.1、this关键字在jquery中引用的是DOM对象,而不是jquery对象,所以可以使用原生的DOM属性
来确定被单击元素的ID,如:
$(document).ready(function(){
$('#switcher .button').bind('click',function(){
$('body').removeClass();
if(this.id == 'switcher-narrow'){
$('body').addClass('narrow');
}
});
});
1.2、简写事件方法
简写事件方法的原理与对应的.bind()调用相同,如:
$('#switcher .button').click(function(){
//...
})
1.3、复合事件
.toggle(fn, fn2, [fn3, fn4, ...])
每次点击后依次调用函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次
点击同一元素时,则触发指定的第二个函数,如果有更多函数,则再次触发,直到最后一个。随
后的每次点击都重复对这几个函数的轮番调用。 可以使用unbind("click")来删除。
1.4、其他
冒泡型事件容易出现一些意外的错误,用如下的函数可以屏蔽这个问题:
通过.target可以确定DOM中首先接收到事件的元素(即实际被单击的元素)
$('#switcher .button').click(function(event){
if(event.target == this){
//...
}
})
.stopPropagation()可以完全阻止事件冒泡
$('#switcher .button').click(function(event){
//...
event..stopPropagation();
})
.preventDefault()可以终止默认操作,如表单enter按钮默认的submit事件。
对于只需要发生一次的事件用.one()函数;
模拟事件操作----.trigger()函数
$(document).ready(function(){
$('#switcher').trigger('click');//简写$('#switcher').click();
});
2、DOM操作
2.1、插入操作
.insertBefore()和.before()方法作用相同,但是在使用.before()方法时,(.insertAfter()和.after()相同),必须把选择器表
达式放在这个方法前面。如:
$('div.chapter p').after('<a href="#top">back to top</a>')
分享到:
相关推荐
这篇博文“收集记录一些使用Javascript,JQuery时遇到的问题”旨在汇总这些常见问题,提供解决方案,并帮助读者更好地理解和应用这两种强大的脚本语言。 JavaScript作为Web开发的核心技术之一,是所有浏览器都支持...
总之,“jQuery计算器带操作记录”项目展示了如何巧妙地结合HTML、CSS和JavaScript,以及jQuery库,来创建一个功能完善的网页应用。它不仅提供了基本的计算功能,还增加了操作历史记录这一实用特性,提升了用户体验...
总之,这个压缩包是前端开发历史的一部分,它记录了 JavaScript 和 jQuery 技术的发展,同时也包含了大量的实践案例和经验总结。无论你是初学者还是经验丰富的开发者,都可以从中受益,学习如何利用这些工具来提升...
对于初学者来说,这个压缩包提供了丰富的实践素材,可以深入了解JavaScript和jQuery的用法,体验各种插件的实现原理,并且学习如何利用UI组件来创建美观的网页。对于经验丰富的开发者,重温这些经典插件和UI设计可以...
在移动Web开发中,jQuery Mobile是一个非常流行的框架,它提供了丰富的UI组件和交互效果,使得开发者可以轻松...通过实践这个项目,开发者不仅能提升jQuery Mobile的使用技能,还能深入了解Web应用的导航和状态管理。
1. **理解基础**:首先,了解JavaScript的基础知识,包括变量、数据类型、控制流、函数和对象。 2. **学习jQuery**:阅读jQuery官方文档,理解选择器、DOM操作、事件、动画和AJAX的基本用法。 3. **实践项目**:...
jQuery是由John Resig于2006年创建的一个JavaScript库,它的核心特性包括选择器、DOM操作、事件处理、动画和Ajax交互等。jQuery以其简洁的API和跨浏览器兼容性,迅速成为开发者们广泛使用的工具。 在这个记事本案例...
jQuery 是一个广泛使用的 JavaScript 库,简化了 DOM 操作、事件处理和动画等任务。 `dragsort.html` 可能是示例页面,它展示了如何在实际项目中应用这个插件。`jquery.js` 是 jQuery 库本身,而 `dragdrop.js` 很...
jQuery 是一个流行的 JavaScript 库,简化了 DOM 操作、事件处理、动画效果和Ajax交互。jQuery 1.7.2 中文手册涵盖了核心的 jQuery 方法,如 `$()` 用于选择元素,`.click()` 用于绑定点击事件,`.append()` 用于向...
这篇博客文章《.NET和jQuery以及控件的使用记录实例》可能是作者在实际项目中使用.NET和jQuery的一些实践记录,可能涉及到了以下几个方面: 1. **ASP.NET Web Forms与jQuery**:在.NET Web Forms中,开发者可以使用...
总的来说,这个"jQuery购买记录滚动更新代码"示例是学习如何使用jQuery和Ajax进行实时数据更新的一个良好起点。开发者可以从中学习到如何结合DOM操作、数据交换和动画效果,创建动态、交互性强的Web应用。为了进一步...
通过学习和分析这个项目,你可以深入了解JSP、JavaScript和jQuery的结合使用,以及如何构建一个功能完备的在线交易系统。这对于提升Web开发技能,尤其是前后端交互和动态网站构建能力非常有帮助。
jQuery 和 jQuery UI 是两个在Web开发中广泛使用的JavaScript库,它们极大地简化了DOM操作、事件处理、动画效果以及用户界面的构建。以下是关于这两个库的详细知识点: **jQuery** jQuery 是一个轻量级的JavaScript...
jQuery是JavaScript的一个库,它极大地简化了HTML文档遍历、事件处理、动画制作以及Ajax交互。...同时,通过阅读源码,开发者可以更深入地了解jQuery的设计思想和实现方式,从而提升自己的JavaScript技能。
在网页开发中,数据分页是一种常见的用户界面技术,它帮助处理大量的...通过分析和理解这个示例,开发者可以快速了解如何在自己的项目中集成和使用jQuery Ajax分页插件,提升用户体验,同时减轻服务器和网络的负担。
jQuery,作为一款广泛使用的JavaScript库,提供了方便的API来操作Cookie,而JSON则是一种轻量级的数据交换格式,非常适合用来存储和传递数据。本文将详细介绍如何利用jQuery和JSON在浏览器端记录用户的浏览历史。 ...
在本文中,我们将深入探讨如何使用Ajax技术与ASP.NET结合,实现动态的添加、删除和修改记录的功能。Ajax(Asynchronous JavaScript and XML)是一种在不刷新整个页面的情况下,与服务器交换数据并更新部分网页的技术...
在开发过程中,开发者可能需要查看SSH框架的源码来了解其内部工作原理,或者使用一些辅助工具如IDE(IntelliJ IDEA、Eclipse)、调试器、版本控制系统(Git)等,以提高开发效率和协作能力。 综上所述,这个主题...
本文将详细讲解如何使用HTML、CSS、JavaScript、jQuery和axios库来实现这个功能。 首先,HTML(HyperText Markup Language)是网页内容的基础,负责结构化的文档布局。在`index.html`文件中,你需要创建两个表单,...
【jQuery九宫格手机锁屏插件】是一个专为Web页面设计的互动锁屏解决方案,尤其适用于移动设备。...通过学习和使用这款插件,开发者可以更深入地了解JavaScript和jQuery在构建动态Web应用中的强大能力。