javascript - 来自javascript的换行符/样式文本?

标签 javascript css text styling

所以首先,这可能有点长。 我正在尝试使用 javascript 制作 RPG 文本游戏。

在我的 HTML 中,我只有 html、head、css、body、div 和 script 标签。

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="story_css.css">
</head>
<body>
<div class="container">
<script src="story_js.js"></script>
</div>
</body>
</html>

所以这纯粹是我游戏信息的容器。

然后我有我的javascript:

var ATTACK = 0;
var STRENGTH = 0;
var DEFENSE = 0;
var RANGED = 0;
var MAGIC = 0;
var AGILITY= 0;
var HEALTH = 0;
var CLASS = prompt("Choose a class (class only effects starting stats, but all classes can learn the same abilities at the same rate):Warrior, Mage, Theif, Archer.").toUpperCase();
switch (CLASS){
    case "WARRIOR":
        ATTACK = 16;
        STRENGTH = 18;
        DEFENSE = 17;
        RANGED = 2;
        MAGIC = 2;
        AGILITY = 5;
        HEALTH = 200;
        break;

    case "ARCHER":
        ATTACK = 6;
        STRENGTH = 5;
        DEFENSE = 11;
        RANGED = 20;
        MAGIC = 3;
        AGILITY = 15;
        HEALTH = 175;
    break;
}

document.write("These are the levels for each of your characters skills. You may write these down and keep track of them, but the game will automatically record your progress for you. However, you will not be able to see your levels until you type a command that asks for them, or if you require a certain level to complete a task.")
var  NAME = prompt("Enter your name:");

confirm("You are about to embark on an epic quest... so, " + NAME + " are you ready to begin?");

document.write("It is the year 3355, according to the Delil calendar, and you awake from your night's sleep. Today is a special day. It is your 18th birthday! In your small village of Shadowhollow, you are one of the 23 people who live there. But as of today, you are one of the villages men.");

我的问题是,当 javascript 执行 document.write 部分时,它只是把它作为一大段文本,即使它们来自不同的提示。有人可以帮我告诉我如何设计它吗?

最佳答案

document.write("<h2>A sample heading</h2>\
<p>These are the levels for each of your characters skills.\
You may write these down and keep track of them, but the game will automatically record your progress for you.\
However, you will not be able to see your levels until you type a command that asks for them, \
or if you require a certain level to complete a task.</p>");
var  NAME = prompt("Enter your name:");

confirm("You are about to embark on an epic quest... so, " + NAME + " are you ready to begin?");

document.write("<h2>A sample heading</h2>\
<p>It is the year 3355, according to the Delil calendar, and you awake from your night's sleep. \
Today is a special day. It is your 18th birthday! In your small village of Shadowhollow, you are one of the 23 people who live there. \
But as of today, you are one of the villages men.</p>");

您可以使用 backslash在 javascript 中将字符串拆分为不同的行。

您可以使用不同的文本标记,例如 <p>对于段落 <h1>用于 heading1 等来设置文本样式,而文本又是 HTML 的一部分.更多风格,您可以查看 css .

如果你想在 javascript 中换行使用 \n\t对于选项卡。这仅用于输出格式。

如果你想在 HTML 中换行结果,使用 <br>

Also the document.write method is deprecated and not recommended, if you are serious about your programming. You have to resort to better DOM manipulation methods like document.createElement appendChild etc to create a document dynamically.

Dynamically create a HTML form with Javascript

关于javascript - 来自javascript的换行符/样式文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16610299/

相关文章:

javascript - 使用 flex-wrap 包裹元素后删除右侧的额外空间,同时保持元素之间的相等间距

php - 如何刷新 div 内的查询

javascript - 某些字体很棒的图标无法在 Safari 中呈现

javascript - 在 JSF 应用程序中显示消息

表格单元格中的 CSS 无边框背景图像

java - 如何使用 JFileChooser.showSaveDialog 保存文件?

HTML - 在 div 容器中插入文本

batch-file - 将所有子目录中的所有.txt文件合并到一个txt文件中

javascript - 如何不使用 Redux 传递 props?

javascript - jQueryUI Slider - 获取初始 slider 值