js | 易学教程

js/jquery获取当前页面URL地址并判断URL字符串中是否包含某个具体值

阅读更多关于 js/jquery获取当前页面URL地址并判断URL字符串中是否包含某个具体值

js/jquery获取当前页面URL地址并判断URL字符串中是否包含某个具体值本文介绍jquery/js获取当前页面url地址的方法，在jquery与js中获取当前页面url方法是一样的，因为jquery没有自己相关的函数，使用js 的windows方法来获取，相关方法如下： window.location.pathname　//设置或获取对象指定的文件名或路径 window.location.href　//设置或获取整个 URL 为字符串 window.location.port　//设置或获取与 URL 关联的端口号码 window.location.protocol　//设置或获取 URL 的协议部分 window.location.hash　//设置或获取 href 属性中在井号“#”后面的分段 window.location.host　//设置或获取 location 或 URL 的 hostname 和 port 号码 window.location.hostname　//设置或获取 location 或 URL 的 hostname 和 port 号码 window.location.search　//设置或获取 href 属性中跟在问号后面的部分 window.location　//属性描述 hash 设置或获取 href 属性中在井号“#”后面的分段来源：

JS加强学习-DOM学习05

阅读更多关于 JS加强学习-DOM学习05

7.6 移除节点 removeChild() 是将父元素中的某个子节点移除掉；这个为彻底移除。 7.7 插入节点 insertBefore 不同于appendChild()，appendChild()为将指定的元素剪切至对象所有子元素的最后。而insertBefore(,)是将指定的元素插入到某个位置之前，第一个参数为指定的元素，第二个参数为父元素中某个子元素的位置，指定元素会插入到第二个参数位置之前。 8. JS设置样式 8.1 JS设置样式的两种方式 style：逐条获取样式属性，逐条改变对应样式。 className：只能获取页面通过style设置的类名，无法获取外联式引入的。当然我们需要改变的样式较少时可以直接通过style的方式改变，可是如果样式较多就可以先在页面style标签中取个类名将所有的样式放在这个类名下，然后使用className的方法来调用这个类名。 8.2 JS设置样式时常有的style属性： backgroundColor：设置背景颜色 backgroundImage：设置背景图片 color：设置字体颜色 width：设置元素宽度 height：设置元素高度 border：设置元素边框 opacity：透明度设置取值范围为0-1，IE8及以前版本的只支持filter：alpha(opacity=XX);XX为0-100之间的值。总结：由于JS中不识别

day15 CSS JS DOM初探

阅读更多关于 day15 CSS JS DOM初探

居中 line-hight 是上下 text-line 是左右实现一个返回顶部的功能： 1 先写好CSS 2 写动作JS 写一个悬浮菜单： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .pg-header{ margin: 0 auto; height: 48px; width:980px; background-color: aquamarine; color: coral; position: fixed; top: 0; left: 20px; right: 20px; line-height: 48px; text-align: center; } .pg-body{ margin: 0 auto; background-color: #dddddd; width:980px; height: 5000px; margin-top: 50px; } </style> </head> <body> <div class="pg-header">此处为菜单</div> <div class="pg-body">此处为内容</div> </body> </html> 效果：上下滚动菜单始终固定在顶部实现一个点赞按钮的效果： <

js 实现div跟随鼠标移动

阅读更多关于 js 实现div跟随鼠标移动

今天看到了一个自己可以随心所欲的拖到div到页面的任意位置。感觉挺好的，就心血来潮的查询了一下，看看网友做的代码如下： <script> function doit(){ var obj = document.getElementById("pad"); obj.style.left = event.x+10; obj.style.top = event.y+10; } window.onload=function(){ document.body.onmousemove = doit; } </script> <div id="pad" style="padding:0px;margin:0px;width:10px;height:10px;left:0px;top:0px;background-color:#ff0000;position:absolute;z-index:100;"></div> 这个网友说不支持FF！！ <script> function doit(e){ var obj = document.getElementById("pad"); obj.style.left = e.pageX+10; obj.style.top = e.pageY+10; } window.onload=function(){ document.body.onmousemove

js动态添加事件

阅读更多关于 js动态添加事件

转载的，但不明确出处往往我们需要在 JS 中动态添加事件，这就涉及到浏览器兼容性问题了，以下谈及的几种方法，我们也常常混合使用。方法一、setAttribute var obj = document.getElementById("obj"); obj.setAttribute("onclick", "javascript:alert('测试');"); 这里利用 setAttribute 指定 onclick 属性，简单，很好理解，但是：IE 不支持， IE 并不是不支持 setAttribute 这个函数，而是不支持用 setAttribute 设置某些属性，包括对象属性、集合属性、事件属性，也就是说用 setAttribute 设置 style、onclick、onmouseover 这些属性在 IE 中是行不通的。 LEO:在IE6下尝试成功方法二、用 attachEvent 和 addEventListener IE 支持 attachEvent obj.attachEvent("onclick", Foo); function Foo() { alert("测试"); } 也可写在一起 obj.attachEvent("onclick", function(){alert("测试");}); 其它浏览器支持 addEventListener obj

js事件处理函数/监听函数

阅读更多关于 js事件处理函数/监听函数

当我们刚接触js的时候,我我们需要给一个鼠标绑定是一个事件的时候,通俗的说就是当鼠标发生一定动作的时候,需要去干什么..比如当click鼠标的时候需要做什么.我们或许会这样写: 1 var getObj = document.getElementById( 'obj' ); //从html节点中找到那个对象. 2 3 getObj.onclick = function (){ //绑定一个事件,当鼠标点击的时候,执行匿名函数里的代码. 4 5 //do something 6 7 } 这样的做法确实很好,并且所有的浏览器都支持该方法,但是久而久之,你会发现,加入要给一个对象绑定多个事件怎么办?写上很多个getObj.onclick = ...?但是这样确实不行的,如果真这样做了,前边的事件会被后面的事件覆盖,得不到想要的结果.这时候我们想到了事件监听函数. IE的事件监听函数: attachEvent (name_event,func) 它的第一个参数是需要绑定的事件的名字,第二个是需要执行的函数句柄,现在你就可以在IE浏览器下一次绑定多个事件了,例如: 01 var click1 = function (){ 02 03 alert( "第一个事件" ); 04 05 }; 06 07 var click2 = function (){ 08 09 alert(

前端-js-长期维护

阅读更多关于前端-js-长期维护

############### JS简介和JS引入 ################ <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body>        <script src="1.js"></script> <div id="d1">sss</div> </body> </html> ############### JS的基本语法和数据类型（数字和字符串） ################ /* js基础语法： 1，注释：单行注释：// 多行注释：

requireJs和r.js压缩工具

阅读更多关于 requireJs和r.js压缩工具

上面release是执行命令 node r.js -o build.js 生成的，需要切换到目录require/tools下面，也就是有r.js和build.js的目录，才能执行命令代码目录如上： main.html代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Hello RequireJS</title> </head> <body> <h1>Hello RequireJS</h1> <script type="text/javascript" src="js/lib/require.js"></script>  <script type="text/javascript" src="js/config.js"></script>  <script type="text/javascript"> /*如果没有配置信息，加载one,two模块，要找到他们的存放路径*/ /* require(["./js/mod/one", "./js/mod/two"], function (one, two)

JS --- reduce()函数

阅读更多关于 JS --- reduce()函数

定义： reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。对空数组是不会执行回调函数的。案例计算数组总和 var num = [1,2,3,4,5]; var res = num.reduce(function(total,num){ return total+num; //return total + Math.round(num);//对数组元素四舍五入并计算总和 },0); console.log(res)；//15 //num.reduce((total,num) => total += num, 0); //没有初始值initialValue（即上面例子中的0），当数组为0时会抛出异常提示reduce函数没有初始值，所以为兼容性一般加上initialValue 合并二维数组 var red = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) { return a.concat(b); }, []); console.log(red) VM291:4 (6) [0, 1, 2, 3, 4, 5] 统计一个数组中有多少个不重复的单词：不用reduce时： var arr = ["apple","orange","apple","orange","pear","orange"]

js密码强度校验

阅读更多关于 js密码强度校验

订阅 js