如何在 HTML 正文中调用 JavaScript 函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19869639/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 15:11:32  来源:igfitidea点击:

How to call a JavaScript function within an HTML body

javascripthtml

提问by user2804038

I have a JavaScript function that fills a table:

我有一个填充表格的 JavaScript 函数:

<script>

var col1 = ["Full time student checking (Age 22 and under) ", "Customers over age 65", "Below  0.00"];
var col2 = ["None", "None", ".00"];

function createtable() {
    <!--To fill the table with javascript-->
    for (var j = 0; j < col1.length; j++) {
        if (j % 2 == 0) {
            document.write("<tr><td>" + col1[j] + " </td>");
            document.write("<td>" + col2[j] + "</td></tr>");
        } else {
            document.write("<tr  bgcolor='#aeb2bf'><td>" + col1[j] + " </td>");
            document.write("<td>" + col2[j] + "</td></tr1>");
        }
    }
}
</script>

I want to execute it within the HTML body. I have tried the following, but it doesn't create the table.

我想在 HTML 正文中执行它。我尝试了以下操作,但它没有创建表。

<table>
    <tr>
        <th>Balance</th>
        <th>Fee</th>        
    </tr>
      createtable();
</table>

How I can execute this function within the HTML body?

如何在 HTML 正文中执行此函数?

回答by HaukurHaf

Try wrapping the createtable();statement in a <script>tag:

尝试将createtable();语句包装在<script>标签中:

<table>
        <tr>
            <th>Balance</th>
            <th>Fee</th>

        </tr>
        <script>createtable();</script>
</table>

I would avoid using document.write() and use the DOM if I were you though.

如果我是你,我会避免使用 document.write() 并使用 DOM。

回答by vishal

First include the file in head tag of html , then call the function in script tags under body tags e.g.

首先将文件包含在 html 的 head 标签中,然后调用 body 标签下的 script 标签中的函数,例如

Js file function to be called

要调用的js文件函数

function tryMe(arg) {
    document.write(arg);
}

HTML FILE

HTML文件

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src='object.js'> </script>
    <title>abc</title><meta charset="utf-8"/>
</head>
<body>
    <script>
    tryMe('This is me vishal bhasin signing in');
    </script>
</body>
</html>

finish

结束

回答by carbontracking

Just to clarify things, you don't/can't "execute it within the HTML body".

只是为了澄清事情,您不能/不能“在 HTML 正文中执行它”。

You can modify the contents of the HTML using javascript.

您可以使用 javascript 修改 HTML 的内容。

You decide at what point you want the javascript to be executed.

您决定在什么时候执行 javascript。

For example, here is the contents of a html file, including javascript, that does what you want.

例如,这里是一个 html 文件的内容,包括 javascript,它可以满足您的需求。

<html>
  <head>
    <script>
    // The next line document.addEventListener....
    // tells the browser to execute the javascript in the function after
    // the DOMContentLoaded event is complete, i.e. the browser has
    // finished loading the full webpage
    document.addEventListener("DOMContentLoaded", function(event) { 
      var col1 = ["Full time student checking (Age 22 and under) ", "Customers over age 65", "Below  0.00" ];
      var col2 = ["None", "None", ".00"];
      var TheInnerHTML ="";
      for (var j = 0; j < col1.length; j++) {
        TheInnerHTML += "<tr><td>"+col1[j]+"</td><td>"+col2[j]+"</td></tr>";
    }
    document.getElementById("TheBody").innerHTML = TheInnerHTML;});
    </script>
  </head>
  <body>
    <table>
    <thead>
      <tr>
        <th>Balance</th>
        <th>Fee</th>        
      </tr>
    </thead>
    <tbody id="TheBody">
    </tbody>
  </table>
</body>

Enjoy !

享受 !

回答by Deepak

Try to use createChild() method of DOM or insertRow() and insertCell() method of table object in script tag.

尝试在脚本标签中使用 DOM 的 createChild() 方法或 table 对象的 insertRow() 和 insertCell() 方法。