使用Javascript替換HTML標記中的文本與innerHTML和功能

我想改變使用元素id「問候」和外部Java腳本h1標記內的文本。我在試圖弄清楚如何調用已經收集變量的函數init並在下一個函數中使用它們時遇到了問題。繼承人到目前爲止我所擁有的。使用Javascript替換HTML標記中的文本與innerHTML和功能

HTML

<head> 

    <title>Matt Beckley</title> 
    <script type="text/javascript" src="script1.js"></script> 
</head> 

<body> 

<h1 id="greeting">Welcome!</h1> 

</body> 
</html>

腳本哪裏出了問題！

window.onload = init; 

function init() 
{ 
var fullname=prompt("Please Enter you name!","Anonymous "); 
(fullname == "Anonymous")? "Anonymous " : ""; 

var nickname=prompt("Please Enter you nickname!"," None"); 
(nickname == "None")? " None": ""; 
} 

function writeGreeting() 
{ 
    document.getElementById("greeting").innerHTML= ????????? 
}

所以我不知道如何使最後的功能工作，以便h1標籤顯示名稱和缺口。 w3schools只顯示「字符串」，而不能調用其他函數。有人知道怎麼做嗎？

來源

2010-01-14 Matt

如何合併init和writeGreeting功能：

window.onload = init; 

function init() 
{ 
var fullname=prompt("Please Enter you name!","Anonymous "); 
fullname = (fullname == "Anonymous")? "Anonymous " : ""; 

var nickname=prompt("Please Enter you nickname!"," None"); 
nickname = (nickname == "None")? " None": ""; 
document.getElementById("greeting").innerHTML= "Welcome " + fullname + " (" + nickname + ")"; 
}

附：語法的小點 - 您可能想要「請輸入您的姓名」，而不是「請輸入您的姓名」，以及類似的暱稱提示。

來源

2010-01-14 12:22:41

// Create two GLOBAL variables 
var fullname = ""; 
var nickname = ""; 

function init() { 
    fullname = /* ... */ 
    nickname = /* ... */ 
    // pass the nickname on to the greeting function 
    writeGreeting(nickname); 
} 

// This function is remain separate, if you wish to call it again 
// at a later time before a page-refresh. 
function writeGreeting(name) { 
    document.getElementById("greeting").innerHTML = name; 
}

來源

2010-01-14 12:23:29 Sampson

這樣怎麼樣？

它會顯示「歡迎全名！」或「歡迎的綽號！」或「歡迎匿名！」如果你不把任何。

function init() { 
    var fullname=prompt("Please Enter you name!"); 
    var nickname=prompt("Please Enter you nickname!"); 
    writeGreeting(fullname||nickname||"Anonymous"); 
} 

function writeGreeting(name){ 
    document.getElementById("greeting").innerHTML= "Welcome "+name+"!"; 
}

來源

2010-01-14 12:32:18 YOU

我喜歡Dominic的解決方案。請記住，您應該小心使用者輸入的任何數據。我建議在使用之前使用escape()函數來轉義字符串。

例如

document.getElementById("greeting").innerHTML= "Welcome " + escape(fullname) + 
               " (" + escape(nickname) + ")";

來源

2010-01-14 12:33:28

這是錯誤的轉義，它是一種特定於JavaScript的編碼，有點像URL編碼，但被破壞了。它會破壞空間和口音等常用名字。任何事情都不應該使用「逃避」。正確的轉義將是HTML編碼，用'<'和'＆'用'&'替代'<'。 – bobince 2010-01-14 13:03:27

啊。然而，你必須同意，它總比沒有好。 :) – 2010-01-14 13:17:25

爲什麼不使用.inner 文本呢？

來源

2010-01-14 12:50:44 pencilCake

因爲它只是IE瀏覽器。在其他最近的瀏覽器上，您可以使用DOM Level 3 Core屬性'textContent'。但是，是的，你絕對不想將未轉義的文本寫入'innerHTML'。 – bobince 2010-01-14 13:05:21

如上所述，innerHTML是危險的：http://www.slideshare.net/x00mario/the-innerhtml-apocalypse – kufudo 2014-12-15 00:00:26

試試這個。經過測試，即鉻和ff（全部最新）。

var msg = "Welcome " + fullname + "(" + nickname + ")!"; 

var greetingElement = document.getElementById("greeting"); 

if(greetingElement.firstChild == null) 
    greetingElement.appendChild(document.createTextNode(msg)); 
else 
    greetingElement.firstChild.nodeValue = msg;

來源

2010-01-14 17:45:17

使用Javascript替換HTML標記中的文本與innerHTML和功能

回答

相關問題