英文:
Make auto titles on html using JS
问题
以下是翻译好的部分：
- 检查是否已存在带有"id"为"titulo"的"h1"标签；如果不存在，则获取文档名称，删除扩展名，将"_"替换为" "，并将其添加到
<h1 id="titulo">中。如果已存在，则不执行任何操作。 - 将
<h1 id="titulo">的内部文本写入<title>标签中。
我得到了这个结果。
控制台显示了如下信息：链接。
英文:
The code below makes the first step: add an image with a link to the home-page and an h1 with the name of the document, if there isn't an h1 already.
I used an html that references a JavaScript file in the <head> and has a <h1> tag for the title (this is one of the expectations that I want to make this because of the special characters).
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
document.write('<a href="rpg.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/U%2B2190.svg/25px-U%2B2190.svg.png"></a><br>');
if (document.getElementById(titulo) != null) /*se existir um não titulo... */ {
var nome_do_documento = window.location.href.substring(window.location.href.lastIndexOf('/') + 1); /*colete o nome do documento */
var titulo = nome_do_documento.replace('_', ' '); /*troque _ por um espaço */
var titulo_pronto = titulo.replace('.html', ''); /*apague a extenção do nome */
document.write('<h1 id="titulo">' + titulo_pronto + '</h1>');
}; /*e o nome no topo da pagina */
document.title = "PVP - " + document.getElementById(titulo).innerText; /*coloque o nome do topo da gina como titulo do html */
<!-- language: lang-html -->
<h1 id="titulo">kauã</h1>
<!-- end snippet -->
I expected these steps:
- check if there's already a h1 with the id of "titulo"; if not then get the document name, remove the extension name and replace "_" with " " and add this to the
<h1 id="titulo">. If yes, do nothing. - write the inner-text of
<h1 id="titulo">in the<title>tag.
I got this result:
<a href="https://i.stack.imgur.com/aeZTf.png"><img src="https://i.stack.imgur.com/aeZTf.png"></a>
<a href="https://i.stack.imgur.com/ck7sT.png"><img src="https://i.stack.imgur.com/ck7sT.png"></a>
答案1
得分: 0
当查找一个元素的ID时，请确保将其作为一个字符串发送：
document.write('<a href="rpg.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/U%2B2190.svg/25px-U%2B2190.svg.png"></a><br>');
/* 如果存在一个名为 "titulo" 的元素... */
if (document.getElementById("titulo") != null )
{
var nome_do_documento = window.location.href.substring(window.location.href.lastIndexOf('/')+1);
/* 收集文档名称 */
var titulo = nome_do_documento.replace('_',' ');
/* 用空格替换下划线 */
var titulo_pronto = titulo.replace('.html','');
/* 删除名称的扩展 */
document.write('<h1 id="titulo">'+ titulo_pronto +'</h1>');
};
/* 将页面顶部的名称设置为HTML标题 */
document.title = "PVP - " + document.getElementById("titulo").innerText;
在你的示例中，引号缺失，这会被视为一个名为 titulo 的变量（第一次调用 getElementById() 时很可能是 undefined，然后在第二次调用时被设置为 nome_do_documento.replace('_',' ')）。
英文:
When looking for an element by ID, be sure to send it as a string:
document.write('<a href="rpg.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/U%2B2190.svg/25px-U%2B2190.svg.png"></a><br>');
/*se existir um não titulo... */
if (document.getElementById("titulo") != null )
{
var nome_do_documento = window.location.href.substring(window.location.href.lastIndexOf('/')+1);
/*colete o nome do documento */
var titulo = nome_do_documento.replace('_',' ');
/*troque _ por um espaço */
var titulo_pronto = titulo.replace('.html','');
/*apague a extenção do nome */
document.write('<h1 id="titulo">'+ titulo_pronto +'</h1>');
};
/*e o nome no topo da pagina */
document.title = "PVP - " + document.getElementById("titulo").innerText;
/*coloque o nome do topo da gina como titulo do html */
In your example the quotes are missing, which is treated as a variable named titulo (likely to be undefined the first time getElementById() is called, then set to nome_do_documento.replace('_',' ') the second time).
答案2
得分: 0
在你的代码中，if语句的条件有错误。将"!="更改为"=="，用引号包围getElementById中的id字符串，错误将被解决。
如果你愿意，这是我对你的代码的快速重构。
(() => {
document.write('<a href="rpg.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/U%2B2190.svg/25px-U%2B2190.svg.png"></a><br>');
let headline = document.querySelector('#titulo');
let title = '';
if (!headline) {
const url = window.location.pathname;
const fileName = url.substring(url.lastIndexOf('/') + 1);
title = fileName.replace(/\.\w+$/gi, '').replace('_', ' ');
headline = document.createElement('h1');
headline.textContent = title;
document.body.appendChild(headline);
} else {
title = headline.textContent;
}
document.title = 'PVP - ' + title;
})();
希望这对你有帮助。
英文:
In your code you have wrong condition in if statement. Change != to ==, surround id string inside getElementById with quotes and the error will be solved.
If you want, this is my quick refactor of your code.
(() => {
document.write('<a href="rpg.html"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c5/U%2B2190.svg/25px-U%2B2190.svg.png"></a><br>');
let headline = document.querySelector('#titulo');
let title = '';
if (!headline) {
const url = window.location.pathname;
const fileName = url.substring(url.lastIndexOf('/') + 1);
title = fileName.replace(/\.\w+$/gi, '').replace('_', ' ');
headline = document.createElement('h1');
headline.textContent = title;
document.body.appendChild(headline);
} else
title = headline.textContent;
document.title = 'PVP - ' + title;
})();
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论