
JavaScript
Ivy_Ch
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
leetcode 刷题记录(有人相爱,有人夜里开车看海,有人leetcode第一题都做不出来。我恨)
面试准备 leetcode刷题 算法原创 2023-02-15 02:01:56 · 455 阅读 · 0 评论 -
js获取当前URL、域名、端口号等
属性 值 举例结果 href 完整的URL http://localhost:8080/project/front/user/serviceIndex?type=1 protocol 协议 http: hostname 主机名 localhost port 端口号 8080 host 主机名+端口号 localhost:8080 pathname 当前 URL 的相对路径 /project/f转载 2021-04-22 14:27:06 · 632 阅读 · 0 评论 -
导航栏保持高亮状态(适合共用导航)
导航栏是所有页面共用的组件,导航栏会单独分离出来作为各个页面的引用,很多时候需要高亮当前页面的选项。这里用js来控制高亮情况。(根据自己的业务需求修改样式)思路:寻找与当前页面路由匹配的hrefcss :.active{ color: #fff; background-color: #c92b30;}当前页面高亮的css类为activehtml:<div id="navbars"> <ul> <li cl.原创 2021-03-31 10:16:08 · 2536 阅读 · 5 评论 -
Javascript 之 Tab切换案例
getAttribute("属性名") 获取标签行内属性setAttribute("属性名","值") 设置标签行内属性removeAttribute("属性名") 移除标签行内属性<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title&...原创 2019-08-24 20:11:02 · 214 阅读 · 0 评论 -
JavaScript之兼容性代码整合(常见、常用)
兼容性代码原理:如果这个属性在浏览器中不支持,那么这个属性的类型是undefined判断这个属性的类型(typeof 属性) 是不是undefined,就知道浏览器是否支持textContent和innerText:设置标签中的文本内容textContent属性,谷歌,火狐支持,IE8不支持innerText属性,谷歌,火狐,IE8都支持 //设置任意的标签中间的任意文本...原创 2019-08-27 00:28:48 · 534 阅读 · 0 评论 -
Javascript 之 DOM案例(1)
1.点击按钮弹出对话框<input type="button" value="弹出来" onclick="alert('我是弹框')">2.点击按钮修改超链接的地址和热点文字 // 根据id获取按钮,注册点击事件,增加事件处理函数 document.getElementById("bth").onclick()=function () { // 根据id...原创 2019-08-27 00:08:26 · 537 阅读 · 0 评论 -
冒泡排序
冒泡排序:把所有的数据按照一定的顺序进行排列(从小到大,从大到下)var arr = [10, 0, 100, 20, 60, 30]; //循环控制比较的轮数for (var i = 0; i < arr.length - 1; i++) { //控制每一轮的比较的次数 for (var j = 0; j < arr.length - 1...原创 2019-08-19 00:46:44 · 148 阅读 · 0 评论 -
关于js 中 DOM处理页面元素的一些事
获取 HTML DOM元素 的方法通过ID获取(getElementById) ts: document.getElementById('idname') 返回元素 通过name属性(getElementsByName)ts: document.getElementsByName('name') 返回数组 通过标签名(getElementsByTagName) 通过类名(getElementsByClassName) 获取html的方法(document.documentElement)...原创 2021-02-22 17:55:04 · 184 阅读 · 0 评论 -
控制物体运动自定义JavaScript函数(匀速、变速)
1.改变某一个元素一段横向距离。匀速动画,可以匀速控制某一元素element移动到目标位置target上; //匀速动画 function animate(element, target) { //清理定时器 clearInterval(element.timeId); element.timeId = setInterval(function ...原创 2019-12-25 13:54:06 · 550 阅读 · 0 评论 -
原生Javascript制作轮播图
1. 根据ul中li个数(图片的个数)动态的创建li,并且加入到ol中,作为小按钮来使用为每个ol中的li添加鼠标进入的事件,(添加事件之前,先把索引保存在每个li的自定义属性中),鼠标进入li的时候做排他功能(背景颜色),移动图片(图片整体移动,移动的ul,每次移动的是一个图片的宽度,图片的宽度就是向宽的宽度),调用的是动画函数,移动ul,移动的是索引值*图片的宽度,并且把索引值存储在一个全局变...原创 2019-12-20 14:25:45 · 261 阅读 · 0 评论 -
JavaScript之冒泡和捕获事件
冒泡事件和捕获事件css代码:#dv1 { width: 300px; height: 200px; background-color: red; } #dv2 { width: 250px; height: 150px; background-color: green; } #...原创 2019-10-19 11:09:52 · 206 阅读 · 0 评论 -
为同一个元素绑定多个不同的事件,指向相同的事件处理函数
<input type="button" value="小苏" id="btn"/><script src="common.js"></script><script>//为id为btn的按钮同时绑定三个事件,分别是click、mouseover、mouseout事件 my$("btn").onclick = f1; my$("btn"...原创 2019-10-15 20:45:34 · 529 阅读 · 0 评论 -
Javascript之全选和不全选
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { padding: 0; margin: 0; } .wrap { ...原创 2019-08-25 04:04:14 · 186 阅读 · 0 评论 -
JavaScript之DOM
掌握常见的浏览器提供的API的调用方式MDN-Web APIJavaScript分三个部分:ECMAScript标准:JS的基本的语法 DOM:Document Object Model --->文档对象模型----操作页面的元素 BOM:Browser Object Model----->浏览器对象模型---操作的是浏览器DOM的概念文档对象模型(Documen...原创 2019-10-19 14:22:13 · 322 阅读 · 0 评论 -
Javascript基础(包含相关案例和练习)
JavaScript:简称jsjs分三个部分ECMAScript 标准——js的基本语法 DOM——Document Object Model 文档对象模型 BOM——Browser Object Model 浏览器对象模型JavaScript是什么?是一门脚本语言 是一门解析性语言 是一门动态类型的语言 是一门基于对象的语言js的代码可以分三个地方写:在html的文...原创 2019-08-19 00:46:10 · 666 阅读 · 0 评论 -
JS之交换两个数的三种方法
使用第三方的变量进行交换var num1=10;var num2=20;//把num1这个变量的值取出来放在temp变量中var temp=num1;//把num2这个变量的值取出来放在num1变量中num1=num2;//把temp变量的值取出来放在num2变量中num2=temp;console.log(num1); //20console.log(num2);...原创 2019-08-07 22:23:29 · 1261 阅读 · 0 评论