概述 项目中需要把一个DOM元素自动滚动到视野内,百思不得其解,最后再element库里面发现了这个方法,记录下来供以后开发时参考,相信对其他人也有用. 参考资料:element scroll-into-view.js 代码 代码如下: /* eslint-disable no-param-reassign */ export default function scrollIntoView(container, selected) { if (!selected) { container.scr

script属性<script async = async charset="utf-8" defer="defer" src="index.html" type="text/javascript"></script>async:可选,表示立即下载下载脚本,但是不妨碍页面中的其他操作,只对外部脚本文件有效,不保证按照指定它们的先后顺序执行charset:可选,表示通过src属性指定的代码的字符集,大多数

元素跟随鼠标在指定区域运动通常是用在商城图片的放大镜中,下面是完整的Demo: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>鼠标区域</title> <style type="text/css"> *{margin:0;padding:0;} .area{ width:

1. css的opacity属性 这个属性用于:设置元素的不透明级别,取值范围:从 0.0 (完全透明)到 1.0(完全不透明),元素所在的文本流还在.这个属性的动态变化可以用来设置元素的淡入淡出效果. 2. JavaScript用法 通过setInterval函数来周期性修改元素的opacity属性值,最后设置完成后,将这个setInterval函数进行clearInterval. var alpha = 50 ; var speed = 10 ; timer = setInterval(fu

一.实现原理: ① 通过onoff开关,判断元素是往下走 还是往上走,并在每次清除定时器后,把onoff 设为 !onoff,以便下次点击做判断 ②move函数的运用 二.代码 <!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> *{ margin:0;padding: 0;} div{position: absolute; w

js元素绑定事件   想给一个元素绑定一个方法之后,在绑定一个方法而且不被覆盖 window.onload = function () { alert('a'); } window.onlaod=function(){ alert('b') } 我们发现它只弹出一个,有一个被覆盖了 下面就说一下js中的绑定事件 attachEvent(IE中用) var oBtn = document.getElementById('btn1'); oBtn.attachEvent('onclick', fun

<script> var x=document.getElementById("p2"); var obj=document.createElement("p");//增加元素,添加的时候首先需要创建出一个元素. obj.innerHTML="hello world"; x.appendChild(obj);//向x中添加一个子元素 x.removeChild(obj);//删除一个子元素 </script>

*****************记录下今天的心得***************** 1.元素的插入顺序 需求:异步从后台读取两个数据a和b,并动态加载到父容器x中,要求a必须在b的左边 实际情况:一开始是用x.append(...)的方法将a.b添加进去,由于是异步加载,查询速度快的请求自然会先显示在页面中的左边,于是最终列表中,a.b是忽左忽右的. 解决办法:使用 a.prependTo(x) 函数,应该好理解,就是始终把a插入到x的最前面. 2.动态加载js 需求:页面加载完毕后,设置页面

<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> #div1 { width: 200px; height: 200px; background-color: red; position: absolute; left: 0; top: 50px; } <

1.偏移量 元素的可见大小由其高度.宽度决定,包括所有内边距.滚动条和边框大小(不包含外边距).通过下列4个属性可以获取元素的偏移量: offsetHeight: offsetWidth: offsetLeft:元素的左外边框包含元素的左内边距的像素距离: offsetTop:元素的上外边框至包含元素上内边距的像素距离. 其中,offsetLeft和offsetTop属性与包含元素有关,包含元素的引用保存在offsetParent属性中. 2.客户区大小 元素的客户区大小,指的是元素内容及其内边

 <div>     </div>     <style>         div {             width: 100px;             height: 100px;             background-color: lightblue;             position: fixed;             top: 0;             left: 0;         }     </style>

html超链接和路径 学习要点:     1.超链接的属性     2.相对与绝对路径     3.锚点设置                              本章主要探讨HTML5中文本元素最重要的一个超链接,探讨它自身的属性以及路径问 题.   一．超链接的属性     <a></a>元素属于文本超链接元素,有一些私有属性或者叫局部属性.那么,相对应的还有通用属 性或叫做全局属性.这方面的知识,后面会详细探讨.           属性名称               

html超链接和路径 学习要点:     1.超链接的属性     2.相对与绝对路径     3.锚点设置                          一．超链接的属性     <a></a>元素属于文本超链接元素,有一些私有属性或者叫局部属性.那么,相对应的还有通用属 性或叫做全局属性.这方面的知识,后面会详细探讨.           属性名称                                 说明             href        指定&l

文本层面的元素(简称文本元素).把这些元素加入文本其中,也就引入了结构和含义. HTML5规范明白指出:使用元素应该全然从元素的语义出发.但这类元素中有些元素的含义很明白,有些则比較含糊. 在元素的使用上最好做到"将呈现工作交给CSS打理",但这并非绝对的,有时候仅仅要保持HTML文档中的一致性就好. 生成超链接 a元素用于生成超链接,a元素有6个局部属性: 1)href:指定a元素所指资源的URL: 2)hreflang:说明所链接资源使用的语言: 3)media:说明说链接资源用于

javascript使用mouseover和mouseout,只在css中支持hover jquery支持mouseover和mouseout,封装了mouseenter.mouseleave事件函数和hover函数 1.有关js中的mouseover和mouseout 原生js的事件类型是mouserout和mouseover,之前提到的事件冒泡的缺陷就在这里,之前说的使用阻止冒泡就行,大概说得太轻易.来理一理它们的触发顺序吧. <div id=”f1”> <div id=”c1”&g

方法一: <html> <head></head> <style> body{padding:100px;} .fileDiv{float:left;width:100px;height:100px;text-align:center;line-height:100px;font-size:12px;border:1px solid #ccc;margin-right:10px;margin-bottom:10px;} .seled{border:1px s

//javascript 权威指南 第三版 第11章 DOM扩展 //取得body元素 var body = document.querySelector("body"); //取得ID为myDiv 元素 var myDiv = document.querySelector("#myDiv"); //取得类为selected 的第一个元素 var selected = document.querySelector(".selected"); //

jquery数组删除指定元素的方法:grep() 金刚 数组 jquery javascript 元素 遇到的问题 今天遇到一个问题,删除数组中的一个指定元素,并返回新的数组. 我定义的js数组是这样的: var sexList=new Array[3]; sexList[0]="1"; sexList[1]="2"; sexList[2]=""; 想达到的效果 我想达到的效果是这样的: 删除索引=1的元素,并返回新数组. 返回的结果是: var

11.原生JavaScript加入收藏夹 function AddFavorite(sURL, sTitle) { try { window.external.addFavorite(sURL, sTitle) } catch(e) { try { window.sidebar.addPanel(sTitle, sURL, "") } catch(e) { alert("加入收藏失败,请使用Ctrl+D进行添加") } } }   12.原生JavaScript设为

目录如下: 1.原生JavaScript实现字符串长度截取2.原生JavaScript获取域名主机3.原生JavaScript清除空格4.原生JavaScript替换全部5.原生JavaScript转义html标签6.原生JavaScript还原html标签7.原生JavaScript时间日期格式转换8.原生JavaScript判断是否为数字类型9.原生JavaScript设置cookie值10.原生JavaScript获取cookie值11.原生JavaScript加入收藏夹12.原生Java

最近一段时间写了很多JavaScript和jquery代码,越来越感觉js基础不牢固,写一句查半天,有时间肯定要系统的学一下. 不说了,先记一下最近学到的点东西,省的以后没时间系统学js还要再来查. 一,在js方法中获取触发方法的事件以及触发事件的元素对象: A.获取事件对象比较简单: var e = window.event; 但是需要注意的是:通过a标签的href是不能触发事件的: //写了一个js方法: function getEvent(){ console.log(window.eve