![](https://img-blog.csdnimg.cn/20200709114846718.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
JAVASCRIPT
JAVASCRIPT
「已注销」
这个作者很懒,什么都没留下…
展开
-
js forEach()为一个对象列表添加不同的属性
有一个简单的需求,为下面的一个列表中各个对象增加一个属性,为第一个对象增加choiced = true,其余增加choiced = false简单摸索下如下:var demo = [{order: 1, name: '哈哈哈'}, {order: 10, name: '李四'}, {order: 9, name: '王五'}, {order: 2, name: '赵六'}] demo.forEach((e, index)=>{index==0?e['choiced']=true:e['choie原创 2021-09-07 00:43:01 · 2217 阅读 · 0 评论 -
django rest_framework实战,前端原生js
本人是python业余选手,公司的系统是我业余时间开发的,一直在维护升级。前段时间更新了一个业务人员下单的功能上方的是本地开发的页面和数据,实际业务中,订单会很多,每天会增加几十条订单记录,那订单的筛选必不可少,而且是多条件查询,这是刚需。先对需求做一个整理:多条件交叉查询异步请求程序采用的是django 2.1.8,跑在本地的windows sever2008上,使用apache2.4部署,前端使用的是django前端模板语言,那么以下几点是可以明确的django rest_fra原创 2020-10-07 16:43:30 · 284 阅读 · 0 评论 -
原生js处理网易新闻api
这是第一次独立脱稿完成api的处理,大概流程总结如下:先使用apipost来处理下接口话说apipost真心不错,比起postman,个人更喜欢apipost。我拿到的是网易新闻的api:https://api.apiopen.top/getWangYiNews参数含义类型page页数stringcount每页获取的新闻条数string通过apipost测试,能成功获取到:{ "code": 200, "message": "成功!", "resu原创 2020-08-12 16:18:59 · 796 阅读 · 0 评论 -
初次接触事件冒泡和事件委托
一、在DOM事件流中,分为事件捕获和事件冒泡,按照介绍,大部分的事件都属于冒泡类型的,举例说明。<html> <body> <div> <p></p> </div> </body></html><script> var p = document.querySelector("p") var div = document.querySelector("div") p.原创 2020-08-08 23:25:21 · 141 阅读 · 0 评论 -
JS练习之表格动态渲染
在django中,生成一个表格很容易,使用django提供的模板语言即可轻松完成,今天练习下js渲染表格的原生写法。需求:动态生成表格,点击删除可删除所在行姓名 科目 成绩 操作魏璎珞 数学 100 删除魏璎珞 数学 100 删除魏璎珞 数学 100 删除魏璎珞 数学 100 删除曹操 语文 200 删除曹植 政治 100 删除曹植 政治 100 删除曹植 政治 100 删除曹植 政治 100 删除1、数据来源暂未学到js和django的数据交互,即django和js对json的原创 2020-08-05 22:55:43 · 1030 阅读 · 0 评论 -
document.location对象学习
js的DOM操作基于document对象,location是常用的一个。打开控制台的console界面,调用location对象,看看有什么属性和方法Location {href: "https://www.w3school.com.cn/jsref/dom_obj_document.asp", ancestorOrigins: DOMStringList, origin: "https://www.w3school.com.cn", protocol: "https:", host: "www.w3sc原创 2020-08-05 17:48:29 · 396 阅读 · 0 评论 -
JS练习之发布留言(创建节点、追加和插入节点操作)
知识点:创建节点追加节点插入节点业务场景中,不会采取这种方式来发布留言,毕竟留言还是要写入数据库的,而且web框架貌似都封装了DOM操作,我猜的。根据B站分红老师的思路:1、获取元素2、绑定事件,处理事件代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>发布留言</title> </head> <body原创 2020-08-05 10:03:12 · 184 阅读 · 0 评论 -
JS练习之tab栏(选项卡)原生代码
今天来个tab栏的练习,从B站上看的视频,按照视频撸一遍代码。要点:排他思想,点击当前对象,追加样式及显示相关内容在js代码中做增加自定义属性的逻辑处理,使用自定义属性来关联点击和内容的呈现,进一步理解一下,假如被点击的对象是A,相关显示的内容是B,那么需要提前为所有的A设置自定义属性data-index,且值为数字(从0开始,刚好符合索引的规则),接着点击A时,获取A自定义属性值,当成B的索引,去调用B。示意图:处理逻辑:点击菜单,使用菜单的索引去设置内容区的display属性,因为菜单原创 2020-08-04 21:59:03 · 272 阅读 · 0 评论 -
JS练习之网站换肤,js原生代码
先看效果1、左侧是待选择的图片列表2、点击对应图片自动为当前网站换背景图片3、为当前选择的图片加个2px的border代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&原创 2020-08-02 00:42:43 · 135 阅读 · 0 评论 -
JS练习之导航菜单点击激活,js原生写法
点击菜单激活,为当前点击的目标追加样式,比如背景颜色或字体颜色,这种操作称之为“排他思想”,其实现的逻辑为:1、先把菜单的样式复原,使用for循环处理2、为当前的元素增加样式,使用for循环处理以下是实现代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width原创 2020-08-01 23:44:57 · 703 阅读 · 0 评论 -
JS练习之获取当前系统时间和星期,并写入当前页面
获取当前系统时间定义一个函数,实例化Datefunction getDate(){ var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var dates = date.getDate(); // console.log(date) var arr = ['周日', '周一', '周二', '周三', '周四', '周五', '周六.原创 2020-07-31 22:29:03 · 275 阅读 · 0 评论 -
js点击弹窗练习(modal/模态框)
要求:点击按钮,弹出窗口,点击关闭按钮关闭窗口要点:1、使用按钮的click方法触发js函数2、js函数中对隐藏的modal设置dispaly为blcok3、点击关闭按钮,通过click方法触发js函数4、js函数中对modal设置display为none示例代码1:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>modal练习</title原创 2020-07-16 22:35:35 · 3859 阅读 · 0 评论