は代入または関数呼び出しを予期し、代わりにJavaScriptを使用した式を見た

Question

私はこのJavaScriptを使用しており、これをHTMLに表示することはできません。コンソールに表示されますが、ページに表示されるのは私の名前です。

"me"という名前のオブジェクトを作成し、名前、都市名、職名を記述します。

// Display the content of the object in the HTML page. 
var me = { 
    name: "Roxann", 
    city: "Denver", 
    jobTitle: "Paralegal" 
}; 

console.log(me); 

document.getElementById("q1").innerHTML = me.name, me.city, me.jobTitle; 

Answer 1

innerHTMLプロパティは、文字列（HTML文字列）を保持しているので、あなたが最初にHTMLコンテンツを構築する必要が

document.getElementById("q1").innerHTML = "Name:"+me.name+ ", City:"+me.city+", "+ me.jobTitle; 

Answer 2

、これを試してみてください：

var html = me.name + ', ' + me.city + ', ' + me.jobTitle; 
document.getElementById("q1").innerHTML = html; 

またはES6を使用して：

document.getElementById("q1").innerHTML = `${me.name}, ${me.city}, ${me.jobTitle}`; 

Answer 3

変数宣言meは問題ありませんでした。すべてのデータがそこにあります。正しく.innerHTMLでそれを設定するには、代わりにこのような何かを試してみてください。

document.getElementById("q1").innerHTML = [me.name, me.city, me.jobTitle].join(' '); 

それとも、それ自身のライン上の各、あなたが行うことができます：

document.getElementById("q1").innerHTML = [me.name, me.city, me.jobTitle].join('\n'); 

それとも空想を取得して、いくつかのHTMLを作成しますオンザフライで：

document.getElementById("q1").innerHTML = [me.name, me.city, me.jobTitle].map(field => { 
    return `<div class="some-class">${field}</div>`; 
}).join(''); 

Answer 4

JavaScriptの結合文字列の順に連結する必要があります。これを行うには2通りの方法があります。

a。加算演算子（+）

var a = "start the sentence,"; 
 
var b = " then join the sentence."; 
 
var result = a + b;

B。 CONCAT（）メソッド

var a = "start the sentence,"; 
 
var b = " then join the sentence."; 
 
var result = a.concat(b);

は両方とも同じ答えになります。

オブジェクトを作成したので、出力を返すメソッドを追加する追加の手順を実行できます。

var me = { 
 
    name: "Roxann", 
 
    city: "Denver", 
 
    jobTitle: "Paralegal", 
 
    toString: function() { 
 
    return this.name + "," + this.city + "," + this.jobTitle 
 
    } \t 
 
};