在html标记内使用'javascript：'
[英]Using 'javascript:' inside html tag
问题描述
I am developing a web server with node.js. 
我正在使用node.js开发Web服务器。 But I got a problem just now. 但是我现在遇到了一个问题。 Below code is my HTML code. 下面的代码是我的HTML代码。
<%
var tagID = 'something';
%>
<a href="..." id="javascript:tagID">...</a>
I know that if I use 'javascript:' inside a HTML tag. 我知道如果我在HTML标记内使用'javascript：'。 then it can execute javascript code. 然后可以执行javascript代码。 but it did not work when I checked it on my browser. 但是当我在浏览器中检查它时，它不起作用。
Or should I use DOM to do this? 还是我应该使用DOM来做到这一点？
3 个解决方案
解决方案1
0 2019-06-14 10:00:27
You can use javascript: in a href . 您可以在href中使用javascript: ：。 Like so 像这样
<a href="javascript:alert('hello')">Hi</a>
解决方案2
0 2019-06-14 10:03:53
You can use https://www.npmjs.com/package/ejs 您可以使用https://www.npmjs.com/package/ejs
// server.js
// load the things we need
var express = require('express');
var app = express();
// set the view engine to ejs
app.set('view engine', 'ejs');
// use res.render to load up an ejs view file
// index page
app.get('/', function(req, res) {
res.render('pages/index');
});
// about page
app.get('/about', function(req, res) {
res.render('pages/about');
});
app.listen(8080);
console.log('8080 is the magic port');
you can embed javascript like this 你可以像这样嵌入javascript
<ul>
<% drinks.forEach(function(drink) { %>
<li><%= drink.name %> - <%= drink.drunkness %></li>
<% }); %>
</ul>
<!DOCTYPE html>
<html lang="en">
<head>
<% include ../partials/head %>
</head>
<body class="container">
<header>
<% include ../partials/header %>
</header>
<main>
<div class="jumbotron">
<h1>This is great</h1>
<p>Welcome to templating using EJS</p>
</div>
</main>
<footer>
<% include ../partials/footer %>
</footer>
</body>
</html>
解决方案3
0 已采纳 2019-06-14 10:10:40
There are 3 ways to do what you are asking: 有3种方法可以完成您要问的事情：
Using a single page application like angular, reacts ...
使用诸如angular的单页应用程序，做出反应... Use your own custom design pattern that will replace whatever you want to replace
使用您自己的自定义设计模式将替换您要替换的任何内容
var global = this; global.id1 = 10; global.id2 = 30; document.querySelectorAll("*").forEach(function(dom) { [...dom.attributes].forEach(function(attr) { if (attr.value.startsWith("javascript:")) { dom.setAttribute(attr.name, global[attr.value.replace("javascript:", "")]); } }); });
<div id="javascript:id1">Div 1</div> <div id="javascript:id2">Div 2</div>
- Do the update manually 手动执行更新
document.getElementById("1").id = "10"; document.getElementById("2").id = "20";
<div id="1">Div 1</div> <div id="2">Div 2</div>
If you are creating a big app then I would reccomand using a single page application (though it might take some time getting to know how it works if you are familiar with it). 如果您要创建一个大型应用程序，那么我建议您使用一个页面应用程序（尽管如果您熟悉它，可能需要一些时间来了解其工作原理）。
If you are feeling adventurous or don't want to bother learning or using an SPA you could create your own framework/design pattern. 如果您喜欢冒险或不想打扰学习或使用SPA，可以创建自己的框架/设计模式。
If the example you have shown is not a common occurence (and you don't expect it to be more common in the future), easiest solution would be to just manually update the dom. 如果您显示的示例不常见（并且您不希望将来出现这种情况），最简单的解决方案是手动更新dom。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.