[英]why using document.write doesn't show text on the browser
I have this code one is a js file, the other is html file, the problem is when i run the code the browser doesnt show the text in functions document.write(...), someone can help me? 我有这段代码,一个是js文件,另一个是html文件,问题是当我运行代码时,浏览器没有在function document.write(...)函数中显示文本,有人可以帮助我吗?
function prose(name, campany){ this.name= name; this.company = company; this.rate = rate; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script type="text/javascript" src="main.js"></script> </head> <body> <script> var y = new prose("JavaScript", "Packt Publishing"); y.rate(50); document.write("The name of the book is " + y.name+ "<br>"); document.write("The name of the publishing company is : " + y.company + "<br>"); document.write("The cost of the book is $" + y.sellingPrice+ "<br>"); </script> <!--Ejemplo 5 <a href="javascript:PacktPub()">Click Here</a> --> </body> </html>
This code works 此代码有效
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
function prose(name, company) {
this.name = name,
this.company = company,
this.rate = 0
}
var y = new prose("JavaScript", "Packet Publishing");
y.rate = 30;
document.write("The name of the book is " + y.name + "<br>");
document.write("The name of the publishing company is : " + y.company + "<br>");
document.write("The cost of the book is $" + y.rate + "<br>");
</script>
<!--Ejemplo 5
<a href="javascript:PacktPub()">Click Here</a> -->
</body>
</html>
You had some syntax errors (campany -> company, rate -> sellingPrice). 您有一些语法错误(campany-> company,rate-> sellingPrice)。
You have several mistakes. 你有几个错误。 First of all, you are referencing company
and it does not exist as you wrote campany
. 首先,您正在引用company
,并且在编写campany
不存在。
Change to: 改成:
function prose(name, company)
Second, prose
is a function, not a class, so it does not recognize the new
you are invoking. 其次, prose
是一个函数,而不是一个类,因此它不能识别您正在调用的new
东西。 To fix that, either remove the new
or change it to be a class: 要解决此问题,请删除new
或将其更改为类:
let prose = (() =>{
function prose(name, company, rate) {
this.name= name;
this.company = company;
this.rate = rate;
}
return prose;
})();
And also fix the way you are setting the rate. 并修复您设置费率的方式。
y.rate = 50;
This should explain everything 这应该解释一切
<body>
<script>
// Defines an object prototype called prose
function prose(name, company){
// Any parameter names used inside the constructor must exist in its
// signature above
this.name = name;
this.company = company;
// prose.rate is initially set to an empty string because no rate
// argument is passed in
this.rate = "";
}
// Constructs a new object using the `prose` prototype. (Note that
// JS now also has 'class' syntax available.)
const y = new prose("JavaScript", "Packt Publishing");
// It would be better to use a more descriptive identifier than `y`
// Assigns a new value to the rate property of the new object.
y.rate = 50;
// We will not use `document.write()` because it replaces all
// existing page content each time it is used
// The paragraph element (and others) could be included in static
// HTML instead of added dynamically using javascript as we do here
// Defines nodes to add to the document
const myParagraph = document.createElement("p");
const nameText = document.createTextNode("The name of the book is: " + y.name);
const companyText = document.createTextNode("The name of the publishing company is: " + y.company);
//priceText includes a fallback string in case y.sellingPrice does not exist
const priceText = document.createTextNode("The selling price of the book is: " + (y.sellingPrice || "(unknown)"));
const rateText = document.createTextNode("The rate of the book is: " + y.rate);
// This function can be called repeatedly to create & append a line break
function appendLineBreakTo(parentElement){
const lineBreak = document.createElement("br");
parentElement.appendChild(lineBreak);
}
// Adds all the text nodes inside the newly created paragraph element
myParagraph.appendChild(nameText);
appendLineBreakTo(myParagraph); //Calls function to add <br/>
myParagraph.appendChild(companyText);
appendLineBreakTo(myParagraph);
myParagraph.appendChild(priceText);
appendLineBreakTo(myParagraph);
myParagraph.appendChild(rateText);
appendLineBreakTo(myParagraph);
// Gets a reference to an HTML element that already exists in the DOM
const body = document.querySelector("body");
// Adds the paragraph element (with all of its new text nodes) to
// the existing element
body.appendChild(myParagraph);
</script>
</body>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.