setAttribute and getAttribute的用法 以及阻止<a>的href的默认属性

本文探讨了如何通过JavaScript操作DOM元素,特别是getAttribute与setAttribute方法的使用限制,并讲解了如何阻止a标签的默认行为,以及JavaScript事件执行顺序。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1,它们都有一个共同点那就是不能与document一起使用,因此我们可以利用对象的方式的来访问它,

for example

var pic=document.getElementById("id");

pic.getAttribute() || pic.setAttribute("value","new value");


2关于a链接的默认行为阻止;

for example

<a href="http://www.bibizan.cn" onclick="return false;" >这是一个不能跳转的链接</a>

与disabled的区别就是这种方法,链接是可以点的动的,而disabled不能,点击的感觉有点像是空链接,但他是有链接的对象可惜被阻止了,


另一方面,a 的href属性就是就是他的预定义事件,而onclick也是它的事件,而他们的优先级是js代码段先执行,而href的预定义事件后执行;因此我们要给利用a标签但是又要改变它的默认链接时就可以使用它

for example

<a href="http://www.bibizan.cn" onclick="function(); return false;" >因为这是两个代码块必要要用分号隔开,否则执行的是后者;之所以把return false写在后面就是因为a的href属性是在js代码段后执行的



setAttribute只能接受属性节点比如<p id="description" title=“one”>choose an picture </p>可以替换title的值,不能替换p段落内的文本,在此还需要注意的是p 是元素节点,而文本的内容属于文本节点,不是同类型的节点,需要用firstchild|| childNodes[0]

节点

类型 异常报告 消息 在 [54] 行处理 [/index.jsp] 时发生异常 描述 服务器遇到一个意外的情况,阻止它完成请求。 例外情况 org.apache.jasper.JasperException: 在 [54] 行处理 [/index.jsp] 时发生异常 51: <% 52: List<Article> articles = articleDao.getRecentArticles(5); 53: for (Article article : articles) { 54: User author = userDao.getUserById(article.getAuthorId()); 55: %> 56: <div class="article-card"> 57: <h4><a href="article/detail.jsp?aid=<%= article.getAid() %>"><%= article.getTitle() %></a></h4> Stacktrace: org.apache.jasper.servlet.JspServletWrapper.handleJspException(JspServletWrapper.java:610) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:489) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:376) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:324) javax.servlet.http.HttpServlet.service(HttpServlet.java:623) org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:51) 根本原因。 javax.servlet.ServletException: java.sql.SQLSyntaxErrorException: Unknown column 'id' in 'field list' org.apache.jasper.runtime.PageContextImpl.handlePageException(PageContextImpl.java:654) org.apache.jsp.index_jsp._jspService(index_jsp.java:305) org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:67) javax.servlet.http.HttpServlet.service(HttpServlet.java:623) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:466) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:376) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:324) javax.servlet.http.HttpServlet.service(HttpServlet.java:623) org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:51) 根本原因。 java.sql.SQLSyntaxErrorException: Unknown column 'id' in 'field list' com.mysql.cj.jdbc.exceptions.SQLError.createSQLException(SQLError.java:120) com.mysql.cj.jdbc.exceptions.SQLExceptionsMapping.translateException(SQLExceptionsMapping.java:122) com.mysql.cj.jdbc.ClientPreparedStatement.executeInternal(ClientPreparedStatement.java:953) com.mysql.cj.jdbc.ClientPreparedStatement.executeQuery(ClientPreparedStatement.java:1009) com.myblog.dao.UserDAO.getUserById(UserDAO.java:74) org.apache.jsp.index_jsp._jspService(index_jsp.java:261) org.apache.jasper.runtime.HttpJspBase.service(HttpJspBase.java:67) javax.servlet.http.HttpServlet.service(HttpServlet.java:623) org.apache.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:466) org.apache.jasper.servlet.JspServlet.serviceJspFile(JspServlet.java:376) org.apache.jasper.servlet.JspServlet.service(JspServlet.java:324) javax.servlet.http.HttpServlet.service(HttpServlet.java:623) org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:51) ):注意 主要问题的全部 stack 信息可以在 server logs 里查看 index.jsp <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ page import="com.myblog.model.User, com.myblog.dao.ArticleDAO" %> <%@ page import="com.myblog.model.Article" %> <%@ page import="java.util.List" %> <!DOCTYPE html> <html> <head> <title>MyBlog 首页</title> <link rel="stylesheet" href="css/style.css"> <style> @font-face { font-family: 'MyFont'; src: url('fonts/MYFont/瀞之故障黑体H4.ttf') format('truetype'); } </style> </head> <body> <div class="container"> <%@ include file="left.txt" %> <div class="main-content"> <div class="welcome-section"> <h2>欢迎访问 MyBlog</h2> <p>分享知识,记录生活</p> <% User currentUser = (User) session.getAttribute("user"); if (currentUser != null) { %> <div class="user-info"> <img src="<%= currentUser.getAvatar() %>" class="avatar"> <p>您好, <%= currentUser.getUsername() %>!</p> <% if (currentUser.getIsAdmin() == 1) { %> <p>您是管理员,可以发布和管理文章</p> <% } else { %> <p>您是普通用户,可以浏览和评论文章</p> <% } %> </div> <% } else { %> <p>请<a href="login.jsp">登录</a>或<a href="register.jsp">注册</a>后使用更多功能</p> <% } %> </div> <div class="recent-articles"> <h3>最新文章</h3> <div class="article-list"> <!-- 从数据库获取最新文章并展示 --> <jsp:useBean id="articleDao" class="com.myblog.dao.ArticleDAO" /> <jsp:useBean id="userDao" class="com.myblog.dao.UserDAO" /> <% List<Article> articles = articleDao.getRecentArticles(5); for (Article article : articles) { User author = userDao.getUserById(article.getAuthorId()); %> <div class="article-card"> <h4><a href="article/detail.jsp?aid=<%= article.getAid() %>"><%= article.getTitle() %></a></h4> <div class="article-meta"> <span>作者: <%= author.getUsername() %></span> <span>发布时间: <%= article.getCreatedAt() %></span> </div> <div class="article-excerpt"> <%= article.getContent().substring(0, Math.min(100, article.getContent().length())) %>... </div> </div> <% } %> </div> </div> </div> </div> </body> </html> UserDAO.java package com.myblog.dao; import com.myblog.model.User; import com.myblog.util.DBUtil; import java.sql.*; public class UserDAO { public User getUserByUsername(String username) { String sql = "SELECT * FROM users WHERE username = ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setString(1, username); try (ResultSet rs = stmt.executeQuery()) { if (rs.next()) { User user = new User(); user.setUid(rs.getInt("uid")); user.setUsername(rs.getString("username")); user.setPassword(rs.getString("password")); user.setEmail(rs.getString("email")); user.setAvatar(rs.getString("avatar")); user.setIsAdmin(rs.getInt("is_admin")); user.setCreatedAt(rs.getTimestamp("created_at")); return user; } } } catch (SQLException e) { e.printStackTrace(); } return null; } public boolean registerUser(User user) { String sql = "INSERT INTO users (username, password, email, avatar, is_admin) VALUES (?, ?, ?, ?, ?)"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setString(1, user.getUsername()); stmt.setString(2, user.getPassword()); stmt.setString(3, user.getEmail()); stmt.setString(4, user.getAvatar()); stmt.setInt(5, user.getIsAdmin()); int rows = stmt.executeUpdate(); return rows > 0; } catch (SQLException e) { e.printStackTrace(); return false; } } public boolean updateUser(User user) { String sql = "UPDATE users SET email = ?, avatar = ? WHERE uid = ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setString(1, user.getEmail()); stmt.setString(2, user.getAvatar()); stmt.setInt(3, user.getUid()); int rows = stmt.executeUpdate(); return rows > 0; } catch (SQLException e) { e.printStackTrace(); return false; } } public User getUserById(int authorId) throws SQLException { String sql = "SELECT id, username, email, avatar FROM users WHERE id = ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setInt(1, authorId); try (ResultSet rs = stmt.executeQuery()) { if (rs.next()) { User user = new User(); user.setUid(rs.getInt("id")); user.setUsername(rs.getString("username")); user.setEmail(rs.getString("email")); user.setAvatar(rs.getString("avatar")); return user; } } } return null; } } ArticleDAO.java package com.myblog.dao; import com.myblog.model.Article; import com.myblog.util.DBUtil; import java.sql.*; import java.util.ArrayList; import java.util.List; public class ArticleDAO { public boolean saveArticle(Article article) { String sql = "INSERT INTO articles (title, content, author_id) VALUES (?, ?, ?)"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql, Statement.RETURN_GENERATED_KEYS)) { stmt.setString(1, article.getTitle()); stmt.setString(2, article.getContent()); stmt.setInt(3, article.getAuthorId()); int rows = stmt.executeUpdate(); if (rows > 0) { try (ResultSet rs = stmt.getGeneratedKeys()) { if (rs.next()) { article.setAid(rs.getInt(1)); } } return true; } } catch (SQLException e) { e.printStackTrace(); System.err.println("保存文章失败: " + e.getMessage()); } return false; } public Article getArticleById(int aid) { String sql = "SELECT * FROM articles WHERE aid = ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setInt(1, aid); try (ResultSet rs = stmt.executeQuery()) { if (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("aid")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("created_at")); article.setUpdatedAt(rs.getTimestamp("updated_at")); return article; } } } catch (SQLException e) { e.printStackTrace(); } return null; } public List<Article> getRecentArticles(int limit) { List<Article> articles = new ArrayList<>(); String sql = "SELECT * FROM articles ORDER BY created_at DESC LIMIT ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setInt(1, limit); try (ResultSet rs = stmt.executeQuery()) { while (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("aid")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("created_at")); articles.add(article); } } } catch (SQLException e) { e.printStackTrace(); } return articles; } public int getTotalArticles() throws SQLException { String sql = "SELECT COUNT(*) AS total FROM articles"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql); ResultSet rs = stmt.executeQuery()) { if (rs.next()) { return rs.getInt("total"); } } return 0; } public List<Article> getArticles(int offset, int pageSize) throws SQLException { List<Article> articles = new ArrayList<>(); String sql = "SELECT id, title, content, author_id, create_at FROM articles ORDER BY create_at DESC LIMIT ?, ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql);) { stmt.setInt(1, offset); stmt.setInt(2, pageSize); try (ResultSet rs = stmt.executeQuery()) { while (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("id")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("create_time")); articles.add(article); } } } return articles; } }
06-12
"发布文章"模块运行时报错,代码: ArticleDAO.java package com.myblog.dao; import com.myblog.model.Article; import com.myblog.util.DBUtil; import java.sql.*; import java.util.ArrayList; import java.util.List; public class ArticleDAO { public boolean saveArticle(Article article) { String sql = "INSERT INTO articles (title, content, author_id) VALUES (?, ?, ?)"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql, Statement.RETURN_GENERATED_KEYS)) { stmt.setString(1, article.getTitle()); stmt.setString(2, article.getContent()); stmt.setInt(3, article.getAuthorId()); int rows = stmt.executeUpdate(); if (rows > 0) { try (ResultSet rs = stmt.getGeneratedKeys()) { if (rs.next()) { article.setAid(rs.getInt(1)); } } return true; } } catch (SQLException e) { e.printStackTrace(); } return false; } public Article getArticleById(int aid) { String sql = "SELECT * FROM articles WHERE aid = ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setInt(1, aid); try (ResultSet rs = stmt.executeQuery()) { if (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("aid")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("created_at")); article.setUpdatedAt(rs.getTimestamp("updated_at")); return article; } } } catch (SQLException e) { e.printStackTrace(); } return null; } public List<Article> getRecentArticles(int limit) { List<Article> articles = new ArrayList<>(); String sql = "SELECT * FROM articles ORDER BY created_at DESC LIMIT ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql)) { stmt.setInt(1, limit); try (ResultSet rs = stmt.executeQuery()) { while (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("aid")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("created_at")); articles.add(article); } } } catch (SQLException e) { e.printStackTrace(); } return articles; } public int getTotalArticles() throws SQLException { String sql = "SELECT COUNT(*) AS total FROM articles"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql); ResultSet rs = stmt.executeQuery()) { if (rs.next()) { return rs.getInt("total"); } } return 0; } public List<Article> getArticles(int offset, int pageSize) throws SQLException { List<Article> articles = new ArrayList<>(); String sql = "SELECT id, title, content, author_id, create_time FROM articles ORDER BY create_time DESC LIMIT ?, ?"; try (Connection conn = DBUtil.getConnection(); PreparedStatement stmt = conn.prepareStatement(sql);) { stmt.setInt(1, offset); stmt.setInt(2, pageSize); try (ResultSet rs = stmt.executeQuery()) { while (rs.next()) { Article article = new Article(); article.setAid(rs.getInt("id")); article.setTitle(rs.getString("title")); article.setContent(rs.getString("content")); article.setAuthorId(rs.getInt("author_id")); article.setCreatedAt(rs.getTimestamp("create_time")); articles.add(article); } } } return articles; } } Article.java package com.myblog.model; import java.sql.Timestamp; import java.util.Date; public class Article { private int aid; private String title; private String content; private int authorId; private Timestamp createdAt; private Timestamp updatedAt; // 无参构造器 public Article() {} // 全参构造器 public Article(int aid, String title, String content, int authorId, Timestamp createdAt, Timestamp updatedAt) { this.aid = aid; this.title = title; this.content = content; this.authorId = authorId; this.createdAt = createdAt; this.updatedAt = updatedAt; } // 用于发布文章的构造器 public Article(String title, String content, int authorId) { this.title = title; this.content = content; this.authorId = authorId; this.createdAt = new Timestamp(new Date().getTime()); } // Getter和Setter方法 public int getAid() { return aid; } public void setAid(int aid) { this.aid = aid; } public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getContent() { return content; } public void setContent(String content) { this.content = content; } public int getAuthorId() { return authorId; } public void setAuthorId(int authorId) { this.authorId = authorId; } public Timestamp getCreatedAt() { return createdAt; } public void setCreatedAt(Timestamp createdAt) { this.createdAt = createdAt; } public Timestamp getUpdatedAt() { return updatedAt; } public void setUpdatedAt(Timestamp updatedAt) { this.updatedAt = updatedAt; } } publish.jsp <%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ page import="com.myblog.model.User" %> <% User currentUser = (User) session.getAttribute("user"); if (currentUser == null || currentUser.getIsAdmin() != 1) { response.sendRedirect("login.jsp"); return; } %> <!DOCTYPE html> <html> <head> <title>发布文章</title> <link rel="stylesheet" href="css/style.css"> <!--<script src="https://cdn.tiny.cloud/1/YOUR_API_KEY/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script>--> <!-- 替换为本地资源 --> <script src="tinymce.min.js"></script> <script> tinymce.init({ selector: '#content', plugins: 'link image code', toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright | link image | code' }); </script> </head> <body> <div class="container"> <%@ include file="left.txt" %> <div class="main-content"> <div class="form-container"> <h2>发布新文章</h2> <% if (request.getAttribute("error") != null) { %> <div class="error-message"><%= request.getAttribute("error") %></div> <% } %> <form action="ArticleServlet" method="post"> <input type="hidden" name="action" value="publish"> <div > <label for="title">文章标题</label> <input type="text" id="title" name="title" required> </div> <div class="form-group"> <label for="content">文章内容</label> <textarea id="content" name="content" rows="20"></textarea> </div> <button type="submit" class="btn">发布文章</button> </form> </div> </div> </div> </body> </html>
06-12
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值