Question

我刚开始学习Javascript，而且我几乎一无所知。我试图将onclick事件附加到我的HTML中的元素。

var joinList = function() {
    alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;

到目前为止，这是我的代码。单击带有标头ID的元素时，没有任何反应。我做错了什么？

以下是我的HTML代码

<!DOCTYPE html>
<html>
    <head>
        <title>Testing Page</title>
        <script src="testing.js"></script>
    </head>

    <body>
        <h1 id="header">Andrew Dawson</h1>
    </body>
</html>

Answer 1

问题是，你试图加载一个html元素，当执行javascript函数时它不会“存在”，因为dom还没有完成加载。为了使您的代码有效，您可以尝试以下解决方案：

将您的脚本标记放在HTML中：

<!DOCTYPE html>
<html>
    <head>
        <title>Testing Page</title>
    </head>

    <body>
        <h1 id="header">Andrew Dawson</h1>
        <script src="testing.js"></script>
    </body>
</html>

添加一个事件处理程序以检查窗口元素是否准备就绪：

window.addEventListener("load", eventWindowLoaded, false);

function eventWindowLoaded(){

    var joinList = function() {
        alert("This should display when clicked");
    }
    document.getElementById("header").onclick = joinList;

}

另一种解决方案是使用jquery框架和相关的文档就绪函数 http://api.jquery.com/ready/

Answer 2

您的代码似乎很简单，也许您的脚本在DOM完全加载之前运行。为了在所有浏览器中保持简单，我们可以在末尾放置一个自执行匿名函数，以在DOM加载后启动所有脚本。

  <html>
  <title></title>
  <head></head>
  <body>
  html here!!
  <script>

    (function() {  
       //Any other scripts here

       var joinList = function() {
             alert("This should display when clicked");
         }
       document.getElementById("header").onclick = joinList;


     })();

   </script>
   </body>
   </html>

以上是纯粹的javascript，不要与jquery＆＃34;文档onready＆＃34;的简写（见下文）混淆。函数（您需要将jquery添加到您的页面）。

$(function() {
        //your javascript code here
});

Why using self executing function?

Answer 3

我认为您正在寻找的解决方案是

names = ['a', 'b', 'c']
df.iloc[1:4, 0] = names  # +1 to the length (e.g. 100:201)

print(df)

   author  episode_number episode_title quote
0  Monica             1.0      Roommate    Hi
1       a             1.0      Roommate    Ho
2       b             1.0      Roommate    Ha
3       c             1.0      Roommate    He
4  Monica             1.0      Roommate    Hu

将onclick事件附加到元素不起作用

3 个答案: