JS简单版发布留言 删除留言

最新推荐文章于 2023-08-29 17:29:08 发布
最新推荐文章于 2023-08-29 17:29:08 发布
阅读量792 收藏 2
点赞数 3
分类专栏： Javascript 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_46513544/article/details/104896586
版权

核心思路：1 点击按钮之后，动态生成一个li,添加到ul里面
2 创建li的同时，又把文本域里面的li.innerHTML赋值给li
3 如果想要新的留言后面显示就用appendChild ,如果想要留言前面显示就用insertBefore
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
删除思路分析：1 把文本域里面的赋值给li的时候，对添加一个删除的链接
2需要把所有的链接获取过来，当我们点击链接的时候，删除当前所在的li
在这里插入图片描述

jasmine s
关注
  • 3
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
JavaScript实现留言板
希望我的博客，能帮上你解决学习中工作中所遇到的问题
11-01 350
JavaScript实现留言板
javascript案例17——留言发布、简易发布留言案例
努力、拼搏、奋进
05-09 703
一、案例描述 留言发布：最新发布的内容在最下方显示。 二、案例效果演示 三、案例局部代码 css代码： <style> * { margin: 0; padding: 0; } #content { padding: 50px; } textarea { width: 300px; height: 200px; box-shadow: 0
简易留言板
qq_40687516的博客
12-21 506
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
使用js实现留言板效果
最新发布
xiaocantongxue的博客
08-29 578
【代码】使用js实现留言板效果。
JavaScript（JS）网页--删除留言
Dreamer
11-22 1202
删除留言 留言板的使用会加大交流，但是对于一些不好的留言或者有错误信息的留言则需要进行删除，在发布留言时，在留言的最末端增加一个删除的链接，点击删除的链接即可删除本条留言。删除留言的操作： <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-
JS实现简易留言板（节点操作）
10-15
这个简单的留言板功能通过JavaScript的DOM操作实现了动态添加和删除留言，为用户提供了一个交互式的界面。值得注意的是，这里的删除操作是基于事件委托的原理，只在发布新留言时为所有的删除链接添加点击事件监听器...
JS实现简易留言板特效
10-15
在本文中，我们将探讨如何使用JavaScript（JS）实现一个简单的留言板特效。这个特效包括用户输入评论、显示评论列表以及提供删除评论的功能。以下是一些关键知识点和代码分析： 1. **textarea**: `textarea` 是HTML...
JS实现简易留言板增删功能
10-15
本篇文章将详细讲解如何使用JavaScript（JS）来创建一个简单的留言板，实现留言的添加和删除功能。由于这是一个静态的实现，所以我们不会涉及到数据库存储，而是直接操作DOM元素来模拟增删效果。 ### 1. HTML结构 ...
JS留言板添加和删除特效代码
03-20
【JS留言板添加和删除特效代码】是网页交互设计中一种常见的功能实现，它结合了JavaScript语言的优势，为用户提供了动态的、实时的留言添加与删除体验。JavaScript是一种轻量级的解释型编程语言，常用于网页前端开发...
JavaScript简单实现的仿微博留言功能示例
10-17
在本示例中，我们看到一个简单的JavaScript实现，用于创建一个仿微博留言的功能。这个功能的核心在于动态地向页面添加新的留言（li元素），并确保它们按照正确的顺序显示。以下是对这一实现的详细分析： 首先，HTML...
案例：简单版发布留言.html
06-09
主要涉及元素节点的操作，创建节点，添加节点，获取节点的内容等等，主要的知识点在文章中已经都有罗列，是十分有必要牢记的
制作简易留言板html5，使用jquery实现留言以及删除功能
kkkliao1的博客
06-21 2777
制作简易留言板html5，使用jquery实现留言以及删除功能
js开发实例 —— 简单版发布留言&简单版删除留言
mocoll的博客
08-21 204
十一、简单版发布留言 思路： ① 核心思路:点击按钮之后,就动态创建一个i ,添加到ul里面。 ② 创建li的同时,把文本域里面的值通过i.nnerHTML赋值给li 。 ③ 如果想要新的留言后面显示就用appendChild如果想要前面显示就用insertBefore 。 HTML 代码： JS 代码： 十二、简单版删除留言（接十一） 思路： ① 当我们把文本域里面的值赋值给1i的时候,多添加一个删除的链接 。 ② 需要把所有的链接获取过来.当我们点击当前的链接的时候,删除当前链接所在的li。 ③ 阻
js实现简单发布删除留言案例(高级版)
黄大仙
08-06 590
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> textarea{ height: 100px; border: #6db8ff solid 1px; } ul { .
js-简版发布删除留言
qq_41670147的博客
11-26 235
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
JavaScript-简单版发布留言案例
weixin_43569948的博客
01-14 1995
Javascript WebAPI DOM 节点操作之简单版发布留言案例 主要复习了节点操作的创建和添加以及删除节点的知识 实现功能：1.留言板由下至上发布留言 2.删除留言 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"
js-简单版发布留言
weixin_40507158的博客
06-09 306
这个案例比较简单，主要是是对发布按钮的一个方法。当点击发布按钮时，对下边的ul里面添加li元素，然后让li获取到textarea里面用户输入到的值 涉及知识点 下面展示一些 内联代码片。 1.父级节点parentNode：（离元素最近的父级节点） node.parentNode 2.子节点 parentNode.childNodes得到父节点下的所有孩子（包含元素节点、文本节点） parentNode.children可得到元素节点 parentNode.firstChild和parentNode.l
利用JavaScript批量删除QQ空间说说（只需一个浏览器）
徐奕的专栏
08-07 4798
每个人都有历史，记录说说是保存瞬间思想的最好方式，但时间久了，我们发现从前的灵光闪现是多么的好笑，于是我们开始删说说，可是说说那么多，哎算了重注册一个QQ号吧。别这样，这里教你一种快速删说说的方法，无需下载任何软件（但还是推荐使用360、QQ或谷歌浏览器比较好），只需要在电脑上打开QQ空间。按下键盘上的F12键（注意是功能键哦！！！），浏览器会自动打开一个界面后转到Console（控制台）选项卡，粘
js简单留言板添加删除的代码
05-13
以下是一个简单的留言板的添加和删除功能的 JavaScript 代码： ```html <!DOCTYPE html> 留言板 留言板 <!-- 表单用于提交留言 --> 姓名： <input type="text" id="name" name="name" required><br>...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值