需求说明： 在页面中有一个图片和一个关闭按钮 当滚动条向下或向右移动时，图片和关闭按钮随滚动条移动，相对于浏览器的位置固定 单击“关闭”按钮时，页面中的图片和关闭按钮不显示 <script...其余导航项关闭 帮助中心，文本框获得焦点时，默认文字消失，失去焦点时，再次显示文字 购物流程，鼠标指针移过时，当前项高亮显示，鼠标指针移动至父元素或祖先元素时，依旧高亮，只有当鼠标指针移动至其同辈元素时...验证提示信息显示在对应表单元素的后面，例如：若用户名中包含非法字符，在文本框后进行提示 关键代码： $("#user").blur(function...1）点击人员信息表右上角的添加按钮，弹出人员详细信息窗口； 2）修改弹出窗口的标题为“新建人员信息”； 3）点击确定验证输入框中的数据是否符合标准;输入标准主要有以下两点: 1，所有的输入框不能为空，为空时显示...1）点击表格中每一列的编辑按钮 或表格中每一行的姓名列，弹出人员详细信息窗口； 2）修改弹出窗口的标题为“人员详细信息”； 3）将当前行数据信息，回显至弹出界面中对应的输入框中； 4） 数据验证通过后，
方式二：通过 DOM 元素属性绑定。 5、JavaScript综合案例 5.1、案例效果介绍 在“姓名、年龄、性别”三个文本框中填写信息后，添加到“学生信息表”列表（表格）中。...5.2、添加功能的分析 为添加按钮绑定单击事件。 创建 tr 元素。 创建 4 个 td 元素。 将 td 添加到 tr 中。 获取文本框输入的信息。 创建 3 个文本元素。...将文本元素添加到对应的 td 中。 创建 a 元素。 将 a 元素添加到对应的 td 中。 将 tr 添加到 table 中。 5.3、添加功能的实现 <!...("td"); let deleteTd = document.createElement("td"); //4.将td添加到tr中 tr.appendChild...td中 deleteTd.appendChild(a); //10.获取table元素，将tr添加到table中 let table = document.getElementById
2. scroll() 方法描述：为 JavaScript 的 “scroll” 事件绑定一个处理函数，或者触发元素上的该事件。...需求描述：为 ul 下的所有 li 添加单击事件，要求将该单击事件委托给 ul，当单击 li 时，所对应的 li 背景变为红色 1111 2222</...需求描述：当文本框获取焦点时，设置其背景为红色，当文本框失去焦点时，设置其背景为绿色 $(':text').focus(function () { $(...需求描述：当文本框内容改变时，就向控制台输出当前文本框的内容 $(':text').change(function () { console.log($...需求描述：当文本框的内容被选择时，就向控制台输出当前文本框的内容 $('input').select(function () {
3.JQuery流行程度 jQuery现在已经成为最流行的javascript库，在世界前10000个访问最多的网站中，有超过55%在使用jQuery。...id=003\">Delete" + ""); // 找到创建出来的a标签，再给它绑定单击事件 $trObj.find...动画执行完成时的回调函数 hide() 隐藏可见的元素 第一个参数是 动画执行的时候，（单位是毫秒） 第二个参数是 动画执行完成时的回调函数 toggle() 可见就隐藏，隐藏状态就显示 第一个参数是...就马上执行了 原生js页面加载完成之后的触发时间是： // 原生js除了要等浏览器内核解析完标签，创建好dom对象之外， // 还需要等页面中所有元素去准备好自己显示时需要的数据。完成之后才会执行。...而jquery的页面加载完成之后，会把所有注册了函数都按照注册的顺序，依次全部执行。 事件 **click()** 绑定单击事件。触发单击事件 **mouseover()** 绑定鼠标移入事件。
4、清空td的内容 5、创建一个input输入域 6、将临时变量的值赋给input输入域的value值 7、将该input元素插入到当前td中 8、取消绑定到该td上的click事件 完善点1：修改后单击回车键...，修改过的值写入td，input消失, 重新单击时，又可以进入编辑状态 完善点2：文本框内容高亮显示 jQuery(function() { //绑定事件方法 //$("td").click(tdclick...(td); //td.append(input); //文本框内容高亮显示 input.get(0).select(); //取消绑定的事件 td.unbind("click"); //另一种方法 //...var obj={name:"mike",age:12}; jquery中的两大特性：链式调用和隐式递归 html() html(val) //匹配第一个元素 text() text(val) //匹配所有的元素...val() val(val) //匹配第一个元素 jquery中的相当于js中的onload方法 //jQuery(function() $(document).ready(function() /
上一博文种讲解了JavaScript基础的ECMAScript，包括基本语法和部分对象，本文中继续讲解JavaScript中比较重要的两部分内容BOM、DOM及事件，后文中有对应的实战练习。...，通过元素属性的className属性来设置class的属性值，应用较多； 5、动态表格案例实战 1）添加表格的实现思路： * 1、给添加按钮绑定单击事件 * 2、获取文本框内容 * 3、创建td，设置...td的文本为文本框的内容 * 4、创建tr，将td添加到tr中 * 5、获取table，将tr添加到table中 2）删除表格的实现思路： * 1、确定点击的是哪一个超链接 * 2、再删除 /*添加 * 1、给添加按钮绑定单击事件...* 2、获取文本框内容 * 3、创建td，设置td的文本为文本框的内容 * 4、创建tr，将td添加到tr中 * 5、获取table，将tr添加到table
在所有浏览器中，链接的默认外观是： 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动链接带有下划线而且是红色的 属性： 属性值描述downloadfilename...单击后没有反应，可以配合JS程序 <a href=”javascript:void(0)” onclick=”alert(‘点我啊！！’)”...简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。 tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。...表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。...GET适合少量数据的提交。一般使用GET提交时，提交的数据会在地址栏中显示出来。一般搜索查询的时候用GET提交。 何时使用POST?
根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点： 整个文档是一个文档节点 每个 HTML 元素是元素节点 HTML 元素内的文本是文本节点 每个 HTML 属性是属性节点...可通过 JavaScript （以及其他编程语言）对 HTML DOM 进行访问。所有 HTML 元素被定义为对象，而编程接口则是对象方法和对象属性。方法是能够执行的动作（比如添加或修改元素）。...当事件发生时，可以执行 JavaScript，比如发生用户点击一个 HTML 元素的事件。...如需在用户点击某个元素时执行代码，可以把 JavaScript 代码添加到 HTML 事件属性中：onclick=JavaScript HTML 事件的例子： 当用户点击鼠标时 当网页已加载时 当图片已加载时...function onChangeFun(){ alert("文本框元素已输入新的数据") } // 当鼠标悬停在某一个元素上时执行的方法
大家好，又见面了，我是你们的朋友全栈君。 一 介绍 获得焦点事件（onfocus）是当某个元素获得焦点时触发事件处理程序。...失去焦点事件（onblur）是当前元素失去焦点时触发事件处理程序。 一般情况下，这两个事件是同时使用的。...二 应用 文本框获得焦点时改变背景颜色 本示例是在用户选择页面中的文本框时，改变文本框的背景颜色，当选择其他文本框时，将失去焦点的文本框背景颜色恢复原始状态。...> <!...-- function txtfocus(event){ //当前元素获得焦点 var e=window.event; var obj=e.srcElement; //用于获取当前对象的名称 obj.style.background
当用户双击某个对象时调用的事件句柄 onfocus 元素获得焦点时发生 onsubmit 确认按钮被点击时发生 onreset 重置按钮被点击，事件会在表单中的重置按钮被点击时发生...方式二：通过 DOM 元素属性绑定。 5、JavaScript综合案例 5.1、案例效果介绍 在“姓名、年龄、性别”三个文本框中填写信息后，添加到“学生信息表”列表（表格）中。...5.2、添加功能的分析 为添加按钮绑定单击事件。 创建 tr 元素。 创建 4 个 td 元素。 将 td 添加到 tr 中。 获取文本框输入的信息。 创建 3 个文本元素。...将文本元素添加到对应的 td 中。 创建 a 元素。 将 a 元素添加到对应的 td 中。 将 tr 添加到 table 中。 5.3、添加功能的实现 <!...JavaScript 中的 Set 集合，元素唯一，存取顺序一致。
假设具体的验证操作实现在validate函数中，那么我们可以采用如下的HTML时相应的文本框在失去焦点的时候对输入的数据实施验证。...，理想的方式是让HTML只用于定义内容呈现的结构，让CSS控制内容呈现的样式，而所有功能的实现定义在JavaScript中，所以用于实现验证对JavaScript的调用不应该出现在HTML中。...对于这四个文本框对应的元素来说，其class属性在这里被用于进行验证规则的定义。...而真正对输入实施验证体现在如下一段JavaScript调用中，在这里我们仅仅是调用元素的validate方法而已。...当我们输入不合法的数据时相应的错误消息显示在被验证元素的右侧，具体的效果如下图所示。 ?
根元素） body标签中的 ng-app 表示从此到body 结束范围已经被 angularJS接管, 在此区域可使用 angularJS 表达式及指令。... {{100+100}} 2.2 ng-model: (双向绑定) ng-model 指令用于绑定变量/表单元素，这样用户在文本框输入的内容会绑定到变量上...2.5 ng-controller: (指定控制器) $scope 的贯穿整个AngularJS App应用，所有变量，函数，对象全都绑定在$scope对象中，它在视图和控制器间建立一个通道，基于作用域视图在修改数据时会立刻更新...> 姓名 年龄 {{x.name}}</...======================== //1.定义新增和更新时保存表单数据的变量 $scope.entity = {}; //2.新增/更新的保存方法 :
从View侧看，ViewModel中的DOM Listeners工具会帮我们监测页面上DOM元素的变化，如果有变化，则更改Model中的数据； 从Model侧看，当我们更新Model中的数据时，Data...Bindings工具会帮我们更新页面中的DOM元素。...> 将message绑定到文本框，当更改文本框的值时，{{ message }} 中的内容也会被更新。...反过来，如果改变message的值，文本框的值也会被更新，我们可以在Chrome控制台进行尝试。 ?...Vue.js的指令是以v-开头的，它们作用于HTML元素，指令提供了一些特殊的特性，将指令绑定在元素上时，指令会为绑定的目标元素添加一些特殊的行为，我们可以将指令看作特殊的HTML特性（attribute
Jquery的效果 ? 3.实现步骤 第一步：引入jQuery相关的文件 第二步：书写页面加载函数 第三步：在页面加载函数中，获取显示广告图片的元素。...) 第八步：在隐藏广告图片的函数中，使用jQuery的方法让广告图片隐藏(hide()) 第九步：清除隐藏广告图片的定时操作 4.代码实现 ...ancestor descendant: 在给定的祖先元素下匹配所有的后代元素(儿子、孙子、重孙子) parent > child : 在给定的父元素下匹配所有的子元素(儿子) prev + next:...匹配所有紧接在 prev 元素后的 next 元素(紧挨着的，同桌) prev ~ siblings: 匹配 prev 元素之后的所有 siblings 元素(兄弟) 代码演示： ...="选择id为two的元素的下一个元素"/> <div id=
举个例子：div:first返回的是整个DOM文档中第一个div元素，而div:first-child是返回所有div元素下的第一个元素合并后的集合。...NBA 2012季后赛 2. NBA 2011季后赛 3....NBA 2010季后赛 4. NBA 2009季后赛 5....NBA 2008季后赛 6....NBA 2007季后赛 例3（html代码和例2是一样的）：
表单控件的数据绑定就是用v-model指令实现的，它会根据控件类型自动选取正确的方法更新元素。...从上面渲染的结果可看出，文本输入框中显示的是数据属性message的值，而并没有看到元素的value属性的值。...这是因为v-model指令会忽略所有表单元素的value、checked、selected属性的初始值，而总是将当前活动实例的数据属性作为数据来源。...我们应该总是在JavaScript脚本中声明初始值，或者在组件的data选项中声明初始值。 在文本框中输入数据，可以看到输入框下方的内容也会同时发生改变。 ...单选时，绑定的是选项的值（元素value属性的值）;多选时，绑定到一个数组，所有选中的选项的值被保存到数组中。 <!
在XHTML中，除了表单元素之外的所有元素，都应该用id而不是name。...其中HTML是网 页的结构，CSS是网页的外观，JavaScript是网页的行为。在这三大元素中，HTML才是最 重要的，而CSS和.JavaScript只是用来修饰结构的。...并且当图片无法显示时，页面 会显示alt中的文字。 title属性也用于图片描述，不过这个描述文字是给用户看的。并且当鼠标指针移到图片 上时，会显示title中的内容。...①语义上绑定了 label元素和表单元素。 ②增强了鼠标可用性。也就是说我们点击label中的文本时，其所关联的表单元素也会 获得焦点。 举例： <!...for属性使得鼠标单击的范围扩大到label元素 上，极大地提高了用户单击的可操作性。事实上，label标签有两种关联方式，我们拿复选框来说，下面两行代码是等价的。
DOM将整个文档展现为内存中的一棵树，每个元素、属性都是树上的一个节点。...参数为*时传回父节点的所有元素； --> getElementsByTagName()...id的元素 在HTML中，id特性是唯一的，没有两个元素可以共享同一个id，getElementById()方法是从文档树中获取单个元素最快的方法。...一般情况支持JavaScript的所有浏览器都支持DOM。...-- 如下按键过程中，只能在body范围内单击鼠标，其他地方单击鼠标并不会有事件触发； -->
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
