js代码 | 易学教程

如何始终在屏幕中间显示Div

阅读更多关于如何始终在屏幕中间显示Div

一、在中间显示;(参考： sky100articles1790515 ) Div和样式 .ordersearchDivCss { position: absolute; z-index: 100; display: block; background-color: #6ec1df; } <div class="ordersearchDivCss" id="DivMain" style="width: 400px; height:200px" align="center"></div> Js code 调用：<input type="button" id="Button1" onclick="sc1(‘DivMain’)" /> // JScript 文件通过元素id得到对象的函数 function $(id) { return document.getElementById(id); } JS控制id 为"div"的层在屏幕中间function sc1(DivId) { var Div = $(DivId); $(DivId).style.top = (document.documentElement.scrollTop + (document.documentElement.clientHeight - $(DivId).offsetHeight) / 2) + "px"; $

关于js中闭包的一些理解

阅读更多关于关于js中闭包的一些理解

简介:梳理一下闭包的好处和应用。闭包 js变量的作用域主要可以分为全局和局部，在函数里面的变量就称为局部变量。因为函数在执行完后，变量就会被回收，所以有的时候我们想要多次改变一个变量的时候，就会把它设置成全局变量。首先来看写成局部的： function f ( ) { var count = 0 ; console . log ( ++ count ) ; } f ( ) ; // 1 f ( ) ; // 1 f ( ) ; // 1 这里虽然运行了三次，但是，结果都是1。因为对于每一个f()来说，他们的内存都是独立的，也就是你操作你的count，我操作我的count，互不干扰。想要共享这个count，就只能把count变为全局的： var count = 0 ; function f ( ) { console . log ( ++ count ) ; } f ( ) ; // 1 f ( ) ; // 2 f ( ) ; // 3 这样就可以达到效果。顺带一提：全局的变量函数外和函数内都可以访问，局部变量就只能在内部被访问。如果变量命名相同，那么在局部中，局部变量优先。但是全局变量是很不安全的，任何函数都可以改变它。所以我们现在既想要函数可以共享变量，又不想这个变量能被太多的函数都访问。为了解决这个问题，就可以使用函数的闭包。所谓闭包，就是函数里面嵌套函数

JS获取IMG图片高宽

阅读更多关于 JS获取IMG图片高宽

前段时间在LJW写的touchslider.js轮播代码里添加自适应屏幕大小的功能时，遇到一个问题。不管用什么样的方法都无法获取到IMG标签的高宽，最后只有给图片定一个高宽的比例值；趁今天有空我就写了几个demo测试了下，找了下原因；且听我细细说来，如有哪里说的不对的，欢迎拍砖～～～首先获取高宽的方法具我所知有：obj.style.width(height); obj.offsetWidth(offsetHeight); obj.clientWidth(clientHeight); getComputedStyle 与 currentStyle; obj.naturalWidth(naturalHeight) 为了叙述简单，这里仅为width为例。先说第一个方法：obj.style.width；这个方法，只有在标签里用style属性写进了width的大小，才可以获取到值，否则只返回的为空。看下面的demo: <img style="width:400px" src="http://img.hb.aicdn.com/787bf87d05ad774522dd92151b3051b463229a11109598-9QXV9C_fw658"> <script> var imgW = document.getElementsByTagName('img')[0].style.width;

JS基础知识梳理汇总如何能学好Web前端开发

阅读更多关于 JS基础知识梳理汇总如何能学好Web前端开发

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 学习要一步一个脚印，不能一口吃一个胖子，所有的实战经验都是基于理论而积累形成，今天的Web前端入门学习教程就给大家梳理汇总一下JS相关的基础知识点。　　1、执行环境：有时也叫环境，是JavaScript中最为重要的一个概念，执行环境定义了变量或函数有权访问的其他数据。　　2、变量对象：每一个执行环境都有一个与之关联的变量对象，环境中定义的所有的变量和函数都保存在这个的对象中。　　3、作用域链：代码在环境中执行时，会创建变量对象的作用域链，保证对执行环境有权访问的所有变量和函数的有序访问。作用域链的前端，始终是当前执行代码所在环境的变量对象。　　4、活动对象：如果当前执行环境是函数，则将活动对象作为变量对象。　　5、可执行代码：1)全局代码：例如加载外部的JS文件或者本地标签内的代码，全局代码不包括 function体内的代码;2)函数代码：function体内的代码;3)eval代码：eval()函数计算某个字符串，并执行其中的JS代码，比如eval("alert('hello world')")。　　6、执行上下文栈：在一个JS程序中，必定会产生多个执行上下文，JS引擎会以栈的方式来处理它们，也就是执行上下文栈。　　7、作用域：JS是一种没有块级作用域的语言(包括if

我的JS 中级学习篇

阅读更多关于我的JS 中级学习篇

在codefordream上进入中级学习后，感觉立马从js的基础学习往前跳了好远，上面的东西好像都是第一次看到一样．这时候才发现，说来也曾接触过js，但是这时候才发现对js的认识就停在知道两点：js中用var定义变量，用function定义函数！这时候有点羞愧了，说来真是对不起老师们的教导！之前接触js是用于编写网页，当时在dreamwever上编写网页很多功能都没有自己动手用函数实现，而是直接拖动组件等方法创建的，导致好像真的除了看到过js代码，自己还真的居然没有写过！中级部分主要有：代码运行规则，类和对象，this引用，原型继承，和回调函数等需要学习的知识．Ａ．关于this引用: 1.函数调用模式的时候，this指向window. 2.方法调用模式的时候，this指向方法所在的对象 3.构造函数模式的时候，this指向新生成的实例 4.apply/call调用模式的时候，this指向apply/call方法中的第一个参数对于一个函数,我们可以通过调用该函数(注意函数也是对象)的apply方法,来将该函数内部的this引用指向一个特定对象.eg: 1 function Tool(name, usage){ 2 this.name = name; 3 this.usage = usage; 4 this.get_info = function() {console.log(

2.Native与Web通信（下）：使用JsBridge

阅读更多关于 2.Native与Web通信（下）：使用JsBridge

JsBridge是lzyzsd写的一款开源项目，开源地址：https://github.com/lzyzsd/JsBridge 下面对JsBridge的接入以及基本使用做一些简单介绍。 1.接入工程build.gradle文件中配置 allprojects { repositories { // ... maven { url 'https://jitpack.io' } } } Module build.gradle文件中添加依赖 implementation 'com.github.lzyzsd:jsbridge:1.0.4' 2.Web调用Native Activity中注册一个Handler，名称与js中定义的保持一致 mBridgeWebView . setWebChromeClient ( new WebChromeClient ( ) ) ; mBridgeWebView . loadUrl ( "file:///android_asset/demo.html" ) ; mBridgeWebView . registerHandler ( "submitFromWeb" , new BridgeHandler ( ) { @Override public void handler ( String data , CallBackFunction function

JavaScript入门

阅读更多关于 JavaScript入门

一、JavaScript基础　　1、概念：　　　　　　JavaScript简称JS，是运行在浏览器端的一门直译式脚本语言，代码不需要编译，可直接运行，并且读入一行，运行一行，多应用于：浏览器端验证、Ajax、富客户端等　　　　　　JavaScript是一种动态类型、弱类型、基于原型的语言，它的解释器称为JavaScript引擎，是浏览器的一部分。　　2、编写位置：　　　　　　标签内部：在标签内部写JS事件代码：结构与行为耦合，不推荐使用　　　　　　网页内部：在<script> </script>标签对内部写JS代码　　　　　　　　　　　　在<body></body>中　　　　　　　　　　　　在<head></head>中　　　　　　外部.JS文件： <script type="text/javascript" src="script.js"></script> 　　3、JavaScript注释：　　　　　　　　单行注释： // 　　　　　　　　多行注释： /* */ 　　4、鼠标事件：　　　　　　onclick：鼠标单击事件，当鼠标单击时执行脚本　　　　　　ondblclick：鼠标双击事件，双击元素执行脚本　　　　　　onmouseover：鼠标移上事件，当鼠标移上元素时执行脚本　　　　　　onmouseout：当鼠标移出元素时执行脚本　　　　　

前端js之BOM和DOM

阅读更多关于前端js之BOM和DOM

BOM与DOM 　　BOM（Browser Object Model）是指浏览器对象模型，它使 JavaScript 有能力与浏览器进行“对话”。　　DOM （Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。　　Window对象是客户端JavaScript最高层对象之一，由于window对象是其它大部分对象的共同祖先，在调用window对象的方法和属性时，可以省略window对象的引用。例如：window.document.write()可以简写成：document.write()。 windows对象所有浏览器都支持 window 对象。它表示浏览器窗口。 *如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。 *没有应用于 window 对象的公开标准，不过所有浏览器都支持该对象。所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。全局函数是 window 对象的方法。接下来要讲的HTML DOM 的 document 也是 window 对象的属性之一。一些常用的Window方法： window.innerHeight -

JS学习笔记5_DOM

阅读更多关于 JS学习笔记5_DOM

1.DOM节点的常用属性（所有节点都支持） nodeType：元素1，属性2，文本3 nodeName：元素标签名的大写形式 nodeValue：元素节点为null，文本节点为文本内容，属性节点为属性值关系属性：parentNode，childNodes，nextSibling，previousSibling，firstChild，lastChild ownerDocument：文档节点（document对象） 2.操作DOM节点（增/删/改） appendChild(node);给当前节点的childNodes列表末尾添加一个节点。若node已存在，则把node移动到当前节点下 insertBefore(node, targetNode);在targetNode前插入node replaceChild(node, targetNode);用node替换targetNode，注意：替换之后targetNode 并没有被销毁，只是变成了游离在DOM树外的文档碎片 removeChild(node);移除node，注意：移除之后node 也没有被销毁，该方法返回node的引用 cloneNode(true/false);复制一个与当前节点完全相同的节点，若true则深复制，否则浅复制， IE会复制相关事件处理器，其它浏览器不会 normalize();用来删掉空文本节点

js技巧

阅读更多关于 js技巧

需求实现下面这么一个搜索框下拉图，当鼠标点击到搜索框显示下边div容器，鼠标点击别处该div容器默认隐藏实现步骤：给该div容器默认隐藏，点击到搜索框后通过js中的show方法进行展示，失去焦点后再进行隐藏问题：由于该实现方式局限，当点击展示div框中的元素时，由于失去元素该div容器被隐藏掉，无法进行跳转解决思路：增加一个函数延迟方法，延迟隐藏容器，使焦点能得以跳转完成再隐藏在这里插入代码片来源： CSDN 作者：一条金枪鱼链接： https://blog.csdn.net/weixin_43867700/article/details/103735741

订阅 js代码