当我单击代码背后的<li>时，Javascript函数返回错误。 - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

前端学习(52)~事件委托

class="my_link">超链接三li> 当我们的鼠标移到标签上的时候，需要获取此的相关信息并飘出悬浮窗以显示详细信息，或者当某个被点击的时候需要触发相应的处理事件...aNodes.length; i < l; i++){ aNodes[i].onclick = function() { console.log('我是超链接 a 的单击相应函数...event.target && event.target.nodeName.toUpperCase() == 'A') { console.log('我是ul的单击响应函数...="javascript:;" class="link">超链接三li> 上方代码，为父节点注册 click 事件，当子节点被点击的时候，...而父节点注册了事件函数，子节点没有注册事件函数，此时，会在父节点中执行函数体里的代码。总结：事件委托是利用了冒泡机制，减少了事件绑定的次数，减少内存消耗，提高性能。

5161 0

Web阶段：第三章：JavaScript语言

代码的结合方式第一种方式只需要在head 标签中，或者在body标签中，使用script 标签来书写JavaScript代码时，就会返回NAN） JS中的定义变量格式： var 变量名; var 变量名 = 值; 返回最后一个表达式的值。第二种：当表达式中，有一个为假的时候。返回第一个为假的表达式的值 || 或运算第一种情况：当表达式全为假时，返回最后一个表达式的值第二种情况：只要有一个表达式为真。...格式如下： function 函数名（形参列表）{ 函数体 } 如何访问函数：函数名( 实参列表 ); 如何定义带有返回值的函数? 答：只需要在函数体内直接使用return语句返回值即可。...// 1、绑定单击事件 function onclickFun(){ // 2 获取输入框中的内容 // 当我们要操作一个标签对象的时候

3.4K2 0

您找到你想要的搜索结果了吗？

是的

没有找到

web前端开发初学者十问集锦（5）

（4）立即执行函数优缺点优点：优点1：立即执行函数模式被广泛使用，它可以帮你封装大量的工作而不会在背后遗留任何全局变量。...假如你的页面是稳定的并且在没有JavaScript情况下能正常工作，然后本着逐步加强的想法，你加入了一些代码加强页面某个方面；你可以将这些代码封装进一个立即执行函数中，并且确保页面没有它的情况下也能正常工作...那么JS事件处理函数中使用return的作用是什么呢？原来JavaScript在事件中调用函数时用return返回值实际上是对window.event.returnvalue进行设置。...3.JS获取元素的left属性为NaN 我遇到的问题是在使用JS获取定位为relative的li>元素时，解析返回值是一个NaN。我获取left属性的代码如下。...出现这种错误的原因是DOM没有加载完毕，JS代码就访问了DOM，很明显会出现上面的错误。

8932 0

Web 性能优化：缓存 React 事件来提高性能

当我赋值 object3 = object1 时，我将 object3 的值赋值为 object1 的地址，它不是一个新对象。...显然，如果所有的都一样，那就意味着没有变化，如果没有任何改变，render 必须返回相同的输出，因此我们不必执行它。这就是 React 快速的原因，它只在需要时渲染。...对于每个唯一值，创建并缓存一个函数; 对于将来对该唯一值的所有引用，返回先前缓存的函数。这就是我将如何实现上面的示例。...clickHandlers = {}; // 在给定唯一标识符的情况下生成或返回单击处理程序。...所述方法将在第一次使用值调用它时创建该值的唯一函数，然后返回该函数。以后对该方法的所有调用都不会创建一个新函数;相反，它将返回对先前在内存中创建的函数的引用。

2.1K2 0

看完这几道 JavaScript 面试题，让你与考官对答如流（中）

当我们单击单个li元素时，打印对应的下标值。但在此外上述代码不起作用，这里每次点击 li 打印 i 的值都是5，这是由于闭包的原因。...闭包只是函数记住其当前作用域，父函数作用域和全局作用域的变量引用的能力。当我们在全局作用域内使用var关键字声明变量时，就创建全局变量i。...因此，当我们单击li元素时，它将打印5，因为这是稍后在回调函数中引用它时i的值。...JavaScript支持闭包和高阶函数是函数式编程语言的特点。 32. 什么是高阶函数？高阶函数只是将函数作为参数或返回值的函数。...所以调用第一个getArgs函数会抛出一个错误。相反，我们可以使用rest参数来获得在箭头函数中传递的所有参数。

2K1 0

70个JavaScript面试问题

var关键字创建一个全局变量，当我们 push 一个函数时，这里返回的全局变量i。...当我们单击单个li元素时，打印对应的下标值。但在此外上述代码不起作用，这里每次点击 li 打印 i 的值都是5，这是由于闭包的原因。...闭包只是函数记住其当前作用域，父函数作用域和全局作用域的变量引用的能力。当我们在全局作用域内使用var关键字声明变量时，就创建全局变量i。...因此，当我们单击li元素时，它将打印5，因为这是稍后在回调函数中引用它时i的值。...在任何非async function的函数中使用await关键字都会抛出错误。await关键字在执行下一行代码之前等待右侧表达式(可能是一个Promise)返回。

1.5K1 0

JavaScript离别之作——HTML元素操作

因此，推荐在开发时尽可能的使用innerHTML获取或设置元素的文本内容。...③ 单击的次数为奇数时，盒子都变大，单击次数为偶数时，盒子都变小。代码实现 PHPli> li class="bg">JavaScriptli> li>C++li> li>Javali> // 获取第2个li元素...③ 遍历并为每个标签添加鼠标滑过事件，在事件的处理函数中，遍历标签对应的所有显示内容，当鼠标滑过标签时，通过classList的add()方法添加current，否则通过remove()方法移出current...❤️❤️❤️ 由于作者水平有限，如有错误和不准确之处在所难免，本人也很想知道这些错误，恳望读者批评指正！

1.1K3 0

Web阶段：第五章：JQuery库

()就是调用这个函数1、传入参数为 [ 函数 ] 时：( function(){} ); 功能跟 window.onload一样。都是页面加载完成之后。...第一个参数是动画执行的时候，（单位是毫秒）第二个参数是动画执行完成时的回调函数 hide() 隐藏可见的元素第一个参数是动画执行的时候，（单位是毫秒）第二个参数是动画执行完成时的回调函数...而jquery的页面加载完成之后，会把所有注册了函数都按照注册的顺序，依次全部执行。事件 **click()** 绑定单击事件。触发单击事件 **mouseover()** 绑定鼠标移入事件。...//给元素绑定事件 //jquery对象.事件方法(回调函数(){ 触发事件执行的代码 }).事件方法(回调函数(){ 触发事件执行的代码 }).事件方法(回调函数...这个event就是javascript传递参事件处理函数的事件对象。

26.3K2 0

分享30个你必须知道的JS基础知识

它返回一个布尔值，指示是否已在特定元素内调用 event.preventDefault()。 9. 为什么代码 obj.someprop.x 会抛出错误？...JavaScript 具有三种作用域：全局作用域、函数作用域和块作用域 (ES6)。全局范围：在全局命名空间中声明的变量或函数驻留在全局范围内，使它们可以从代码中的任何位置访问。...当我们点击一个单独的 li> 元素时，我们想要打印它对应的索引值。但是，上面的代码没有按预期工作。在这种情况下，每次我们单击 li> 时，它都会将 i 的值打印为 5。这是由于闭包造成的。...闭包只是函数从其当前作用域、父函数作用域和全局作用域记住变量的能力。当我们在全局范围内使用 var 关键字声明一个变量时，我们创建了一个全局变量 i。...因此，当我们点击 li> 元素时，它会打印 5，因为这是稍后在回调函数中引用 i 时的值。使用 IIFE 可以解决这个问题。

2553 0

杨老师课堂之Jquery的筛选,事件,效果,Ajax,javascript跨域)

事件,而不触发和元素上的 click事件.当单击元素时,只触发元素上的click事件, 而不触发元素上的click事件....获取到事件的类型 $(“a”).click(function(event){ alert(event.type); //获取事件类型 return false; //阻止链接被跳转 }) 以上代码会返回...•fn:在动画完成时执行的函数，每个元素执行一次。...•callback:载入成功时回调函数。 •type:返回内容格式，xml, html, script, json, text, _default。...•callback:发送成功时回调函数。 •type:返回内容格式，xml, html, script, json, text, _default。

8.3K2 0

ajax使用案例

追加标签用反引号，标签里用服务器返回的数据，使用${}接收变量,${}不用引起来　　　　　　　　　　　　}; }, 这样就出来了：当我点击python，这里显示Python的内容当我点击云计算...里面会请求这个接口并在succes的回调函数里返回4处的数据赋值给存在的变量res。...后面需要对服务器给我们返回的数据进行操作，那么我们就取4中的数据用变量的形式放到ajax创建的html标签中。这样前端访问到这个页面时就要从后端获取来的数据进行渲染的网页了。...所以插入的li标签比如开发者工具，要将这个api返回的数据中的id数作为开发者工具这个li的一个属性记录下来。点击事件反生时就根据获取到的id属性值，来显示另一个表中相同这个外键id的数据表内容。...但是这样的话前面的代码在后面又要写一遍。那么就把前面的代码写成函数，进行调用。然后后面点击事件，先修改sub_category为点击标签的id属性值，然后再调用函数，做同样的步骤显示数据。

11.6K2 0

75个JavaScript面试题集锦，内含解答，自测 JS 掌握程度

var关键字创建一个全局变量，当我们 push 一个函数时，这里返回的全局变量i。...当我们单击单个li元素时，打印对应的下标值。但在此外上述代码不起作用，这里每次点击 li 打印 i 的值都是5，这是由于闭包的原因。...闭包只是函数记住其当前作用域，父函数作用域和全局作用域的变量引用的能力。当我们在全局作用域内使用var关键字声明变量时，就创建全局变量i。...因此，当我们单击li元素时，它将打印5，因为这是稍后在回调函数中引用它时i的值。...在任何非async function的函数中使用await关键字都会抛出错误。await关键字在执行下一行代码之前等待右侧表达式(可能是一个Promise)返回。

13.5K9 4

「Web编程API」- 03

eventTarget（目标对象）上，当该对象触发指定的事件时，就会执行事件处理函数。...DOM事件流 html中的标签都是相互嵌套的，我们可以将元素想象成一个盒子装一个盒子，document是最外面的大盒子。当你单击一个div时，同时你也单击了div的父元素，甚至整个页面。...比如：我们给页面中的一个div注册了单击事件，当你单击了div时，也就单击了body，单击了html，单击了document。当时的2大浏览器霸主谁也不服谁！...键盘触发事件的话，会得到键盘的相关信息，如按了哪个键。事件对象的使用事件触发发生时就会产生事件对象，并且系统会以实参的形式传给事件处理函数。...常情况下terget 和 this是一致的，但有一种情况不同，那就是在事件冒泡时（父子元素有相同事件，单击子元素，父元素的事件处理函数也会被触发执行），这时候this指向的是父元素，因为它是绑定事件的元素对象

1.4K5 0

简单说 JavaScript中的事件委托（上）

从上面的图中我们看见，当点击蓝色 p 元素时，先触发了 p 元素上绑定的事件，然后又触发了红色 div 元素上绑定的事件，这就是事件冒泡了。事件委托的实现先来段代码我们用事件委托的方式改写一下上面的代码，不过在这之前，我们还要明白一下什么是 event 对象任何事件触发后将产生一个event对象 event对象记录事件发生时的鼠标位置...、键盘按键状态和触发对象等信息一般情况下，绑定事件处理函数时，event对象默认以第一个参数方式传入 event对象有许多的属性，具体的可以到这里去看 http://www.w3school.com.cn...就是event对象 //target属性返回触发此事件的元素（事件的目标节点） //nodeName 属性返回指定节点的节点名称(返回的标签名是大写) if...，而是绑定在已经存在于页面上的父元素，冒泡到父元素上时，执行绑定在父元素上的事件处理函数，这样能减少很多不必要的工作。

5962 0

jQuery 事件

它独特而又优雅的代码风格改变了JavaScript程序员的设计思路和编写程序的方式。 ...该方法给 API 带来很多便利，我们推荐使用该方法，它简化了 jQuery 代码库。注意：如需移除指定的事件处理程序，当事件处理程序被添加时，选择器字符串必须匹配 on() 方法传递的参数。...() event.namespace 返回当事件被触发时指定的命名空间 event.pageX 返回相对于文档左边缘的鼠标位置 event.pageY 返回相对于文档上边缘的鼠标位置 event.preventDefault...event.timeStamp 返回从 1970 年 1 月 1 日到事件被触发时的毫秒数 event.type 返回哪种事件类型被触发 event.which 返回指定事件上哪个键盘键或鼠标按钮被按下...>单击我li> li>双击我li> 请在此处操作鼠标，文本编辑框内容会变化。

2.9K7 0

React 设计模式 0x0：典型反例和最佳实践

但是，当我们需要在组件树中传递函数时，我们就会遇到问题。这是因为，当我们在组件树中传递函数时，我们需要将函数传递给每个组件，这会导致组件树变得非常深。...但是，当我们使用嵌套的三元运算符时，代码会变得非常难以阅读。...当我们编写组件时，第一个在渲染中插入 div 元素的想法就会浮现，无论是在类组件的 render 方法中还是在函数式组件的返回语句中。虽然这种做法有效，但它并没有为浏览器提供足够的信息。...useMemo 用于缓存计算结果并返回其值。这个计算不会在每次渲染时都执行。它接受两个参数，即箭头函数和依赖数组。...它可以使您的代码看起来整洁易读，遵守您设定的规则。 # 使用 Linter 使用 Linter 及其规则可以帮助您组织代码，提醒您某些 JavaScript 错误。

1.1K1 0

前端成神之路-WebAPIs03

eventTarget.attachEvent()方法将指定的监听器注册到 eventTarget（目标对象）上，当该对象触发指定的事件时，指定的回调函数就会被执行。 ?...DOM事件流 html中的标签都是相互嵌套的，我们可以将元素想象成一个盒子装一个盒子，document是最外面的大盒子。当你单击一个div时，同时你也单击了div的父元素，甚至整个页面。...比如：我们给页面中的一个div注册了单击事件，当你单击了div时，也就单击了body，单击了html，单击了document。 ? 当时的2大浏览器霸主谁也不服谁！...键盘触发事件的话，会得到键盘的相关信息，如按了哪个键。事件对象的使用事件触发发生时就会产生事件对象，并且系统会以实参的形式传给事件处理函数。...常情况下terget 和 this是一致的，但有一种情况不同，那就是在事件冒泡时（父子元素有相同事件，单击子元素，父元素的事件处理函数也会被触发执行），这时候this指向的是父元素，因为它是绑定事件的元素对象

3K2 0

Jquery入门基础教程免费版

Click事件 3.1 jQuery基础事件 3.1.1 鼠标事件方法描述执行时机 click( ) 触发或将函数绑定到指定元素的click事件单击鼠标时 mouseover( ) 触发或将函数绑定到指定元素的...mouseover事件鼠标指针移过时 mouseout( ) 触发或将函数绑定到指定元素的mouseout事件鼠标指针移出时 3.1.2 键盘事件当我们在键盘尚进行按键操作的时候，做出的响应事件...方法描述执行时机 keydown( ) 触发或将函数绑定到指定元素的keydown事件按下键盘时 keyup( ) 触发或将函数绑定到指定元素的keyup事件释放按键时 keypress( )...当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。 <!...，进行操作; /* $("#app").click(function(){ //当我们在这个按钮上进行单击的时候，逐个获取li的信息内容 //然后打印输出; //each

1021 0

JavaWeb——JQuery之高级操作应用及实践案例总结（动画、遍历、事件绑定）

；参数"linear"，匀速； 3）fn：在动画完成时执行的函数，每个元素执行一次。...2 JQuery遍历 js的遍历方式是使用for循环，JQuery提供了三种遍历方式： 1）JQuery对象.each(callback)：回调函数中的参数 index（索引） element（元素对象...(相当于js中使用的break)，如果返回为true，则结束本次循环，继续下次循环(相当于js中使用的continue)；【练习案例】：的绑定方式：JQuery对象.事件方法（回调函数）；注意：如果调用事件方法，不传递回调参数，会触发浏览器默认行为； 2）on绑定事件、off解除绑定：JQuery对象.on("事件名称"，回调函数)...使用off解除btn按钮的单击事件 $("#btn2").click(function () { //解除btn按钮的单击事件

9.4K2 0

JS事件篇

是网上很常见的代码，#是标签内置的一个方法，用这种方法点击后网页后返回到页面的最顶端所以又有了“##”“#!”...等,尽管解决了返回顶部的问题但仍存在其他缺陷 (3)事件处理函数的工作机制中，在给某元素添加事件处理函数后，一旦事件发生，相应JavaScript代码就会执行，所调用的JavaScript代码的返回值被传递给事件处理函数...当我们给a标签添加onclick事件处理函数并点击a触发其后，如果相应JavaScript代码返回true，onclick事件处理函数就会认为这个链接呗点击了，同样的若返回false即会认为链接...JavaScript代码返回值为false，故此链接默认行为未被触发。...>javascript:;' class='dhy'>新增超链接li>"; } //为ul绑定一个单击响应函数 u.onclick=function(event

12.6K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭