我在字符串中有这个 html，我想修改 src 标签，以便保留值但在属性末尾附加一个字符串
修改前的HTML
<html>
<head>
<title>LDRA Testbed Results</title>
</head>
<script>
var AddTxt = true;
var TBpublish = true;
</script>
<frameset cols="206,*" marginwidth="0" marginheight="0"
FRAMEBORDER="no" BORDERCOLOR="#DEDEEF">
<frame src="./App_xyz_P_tbresults/App_xyz_P.lfm.htm" name="lFrame" NORESIZE>
<frame src="htm_idx/frontpage.htm" name="rFrame" FRAMEBORDER="no">
</frameset>
</html>
修改后的HTML
<html>
<head>
<title>LDRA Testbed Results</title>
</head>
<script>
var AddTxt = true;
var TBpublish = true;
</script>
<frameset cols="206,*" marginwidth="0" marginheight="0" FRAMEBORDER="no" BORDERCOLOR="#DEDEEF">
<frame src="./App_xyz_P_tbresults/App_xyz_P.lfm.htm:A:1" name="lFrame" NORESIZE>
<frame src="htm_idx/frontpage.htm:A:1" name="rFrame" FRAMEBORDER="no">
</frameset>
</html>
如何在 Node.js 中做到这一点
当前代码 这就是我目前使用解析器解析 html 代码的方式
var html = chunk.toString();
var temp = html;
html = parse(html);
var modifiedHTML = [];
var elementsTag = [
"<a ",
"<area ",
"<base ",
"<body ",
"<frame ",
"<iframe ",
"<img ",
"<input ",
"<link ",
"<script ",
"<audio ",
"<embed ",
"<source ",
"<track ",
"<video "
];
var elements = [
"a",
"area",
"base",
"body",
"frame",
"iframe",
"img",
"input",
"link",
"script",
"audio",
"embed",
"source",
"track",
"video"
];
for (var i = 0; i < elementsTag.length; i++) {
var count = (temp.match(new RegExp(elementsTag[i], "g")) || []).length;
for (var j = 0; j < count; j++) {
var elementAttr = html.querySelector(elements[i]);
if (elementAttr != null) {
// console.log(elementAttr);
if (Object.keys(elementAttr.attributes).length > 0) {
Object.keys(elementAttr.attributes).forEach(attribute => {
if (attribute == "src" || attribute == "href") {
var attributeVal = elementAttr.attributes[attribute];
// console.log(attributeVal[j]);
attributeVal = attributeVal + `:${project_name}:${type}`;
elementAttr.setAttribute(attribute, attributeVal);
}
});
}
modifiedHTML.push(elementAttr.outerHTML);
}
}
}
console.log(modifiedHTML);
输出:
[
[0] '<frame src="./App_xyz_P_tbresults/App_xyz_P.lfm.htm:TEST:static_analysis_report1:TEST:static_analysis_report1" name="lFrame" NORESIZE></frame>',
[0] '<frame src="./App_xyz_P_tbresults/App_xyz_P.lfm.htm:TEST:static_analysis_report1:TEST:static_analysis_report1:TEST:static_analysis_report1" name="lFrame" NORESIZE></frame>'
[0] ]
最佳答案
在 JavaScript 中解析 HTML 并不是一项简单的任务。我没有检查您的尝试，但您确实应该使用现有的 HTML 解析器，而不是自己做。
您可以使用例如 jsdom实现你想要的:
const jsdom = require("jsdom");
const { JSDOM } = jsdom;
let html = `<html>
<head>
<title>LDRA Testbed Results</title>
</head>
<script>
var AddTxt = true;
var TBpublish = true;
</script>
<frameset cols="206,*" marginwidth="0" marginheight="0"
FRAMEBORDER="no" BORDERCOLOR="#DEDEEF">
<frame src="./App_xyz_P_tbresults/App_xyz_P.lfm.htm" name="lFrame" NORESIZE>
<frame src="htm_idx/frontpage.htm" name="rFrame" FRAMEBORDER="no">
</frameset>
</html>`;
const dom = new JSDOM(html);
let frameset_children = dom.window.document.body.children;
for (let i = 0; i < frameset_children.length; i++) {
let frame = frameset_children[i];
frame.src = frame.src + ':A:1';
}
console.log(dom.serialize())
关于javascript - 如何在html字符串中的src属性末尾附加一个值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60203828/