在JavaScript函数中将CSS id作为参数传递

I've a CSS id which shows a small red ball and a JAVASCRIPT function. I want to pass the CSS id as a parameter in the JavaScript function. I've seen a lot of tutorials but can't figure it out. Here are the codes:

我有一个CSS id，它显示一个红色小球和一个JAVASCRIPT函数。我想将CSS id作为一个参数传递给JavaScript函数。我看过很多教程，但是我不知道。这是代码:

CSS code

CSS代码

#projectile{
    position: absolute;
    background-color: #ff0000;
    left:176px;
    top: 486px;
    width:10px;
    height:10px;
    border-radius: 8px;
    z-index: 9;
}

JAVASCRIPT code

JAVASCRIPT代码

function gofish(projectile_id){
var projectile = getElementbyId(projectile_id);
start_x = projectile.offset().left;
start_y = projectile.offset().top;

function init()
{ setTimeout("gofish('projectile')", 500); }

3 个解决方案

#1

Lets assume you're using jQuery and that you want a jQuery object to use the offset() method as no such method exists for plain DOM nodes

假设您正在使用jQuery，并且希望jQuery对象使用offset()方法，因为普通DOM节点不存在此类方法

function gofish(projectile_id){
    var projectile = $('#' + projectile_id);
    var start_x = projectile.offset().left;
    var start_y = projectile.offset().top;
}

function init() { 
    setTimeout(function() {
        gofish('projectile');
    }, 500); 
}

#2

You have a few mistakes in your JavaScript.

在JavaScript中有一些错误。

getElementById should have a capital 'b', and should be called against document.
getElementById应该有一个大写的“b”，应该针对文档调用。
I think the offset properties you are look for are element.offsetLeft and element.offsetTop.
我认为你寻找的偏移属性是元素。offsetLeft和element.offsetTop。
You can define an anonymous function directly on setTimeout to call init(), exactly as adeneo has suggested.
您可以直接在setTimeout上定义一个匿名函数来调用init()，正如adeneo所建议的那样。
You will still need to call init() somewhere in order for it to run.
您仍然需要在某个地方调用init()来让它运行。

Here is updated JavaScript code:

以下是更新后的JavaScript代码:

function gofish(projectile_id) {
    var projectile = document.getElementById(projectile_id);
    start_x = projectile.offsetLeft;
    start_y = projectile.offsetTop;
}

function init() {
    setTimeout(function () {
        gofish('projectile');
    }, 500);
}

init();

And here is the code in action, so far: http://jsfiddle.net/JuvDX/

这是目前正在运行的代码:http://jsfiddle.net/JuvDX/

#3

This may help you little..

这对你可能没什么帮助。

    <!DOCTYPE html>
<html>
<head>

<script>
function myFunction(element)
{
alert(document.getElementById(element.id).value);
}
</script>
<style>
#para1
{
text-align:center;
color:red;
} 
</style>
</head>

<body>
<p id="para1" onclick="myFunction(this)" name="paragraph" >Hello World!</p>
</body>
</html>

#1