JavaScript getElementById()

发布于 2024-07-23 22:25:11 字数 658 浏览 8 评论 0原文

我正在尝试创建一个通用的 javascript 函数来更改事件的属性。

它的工作方式是

function fooFunction(sourceElement) 
{    
  var newName = sourceElement+'Span';    
  var newElement = document.getElementById(newName);
  //Important line
  newElement.property = "enter properties here";
}

,我会用类似的方式来称呼它,

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction(this.id);"/>
<span id="fooSpan" name="fooSpan">some text here</span>

所以理论上,当悬停图像时,它应该改变我需要在 fooSpan 对象上更改的任何属性。 它在 Opera 中工作,但在 IE 上它返回一个 null 对象。

有任何想法吗 ?

我的想法是,我将拥有多个图像,它们会自动触发关联文本范围(通常是 css 样式)的属性更改。

I'm trying to create a generic javascript function that would change attributes on events.

The way it would work is

function fooFunction(sourceElement) 
{    
  var newName = sourceElement+'Span';    
  var newElement = document.getElementById(newName);
  //Important line
  newElement.property = "enter properties here";
}

and I'd call it with something like

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction(this.id);"/>
<span id="fooSpan" name="fooSpan">some text here</span>

So in theory, when hovering the image, it should change whatever propery I need to change on the fooSpan object. It works in Opera, but on IE it returns a null object.

Any ideas ?

The idea would be that I would have multiple images that would automatically trigger the property change on the associated text span (typically the css style).

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

两人的回忆 2024-07-30 22:25:11

可能这条线在 IE 中不起作用。 “新元素.属性”
我不知道确切的原因。

您可以使用此代码代替该行

newElement.setAttribute(property,"在此处输入属性");

同时,我正在尝试找出错误背后的原因。

May be this line won't work in IE. "newElement.property"
I don't know the exact reason.

You can use this instead of that line

newElement.setAttribute(property,"enter properties here");

In the mean time, i am trying to find out the reason behind the error.

迷乱花海 2024-07-30 22:25:11

您确定在 IE 中正确获取了 ID 吗? 也许在 IE 中传入的 ID 为空(也许 this.id 不起作用?)。

尝试这样称呼它:

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction('foo');"/>

看看是否有帮助。 我没有看到 getElementById() 失败的任何原因,所以我唯一能想到的是这是一个 ID 问题。

Are you sure you're getting the ID properly in IE? Maybe the ID being passed in is null in IE (perhaps this.id isn't working?).

Try calling it like this:

<img src="foo.gif" id="foo" name="foo" onmouseover="fooFunction('foo');"/>

and see if that helps. I don't see any reason why getElementById() would fail, so the only thing I can think of is that it's an ID issue.

Smile简单爱 2024-07-30 22:25:11

我强烈建议您考虑使用 jQuery 的内置 attr() 方法,该方法跨浏览器完美地集成了您想要的功能,并且非常易于使用。

使用您的示例,如果您想更改“foo”的“src”属性,您可以在一行代码中完成:

$("#foo").attr("src","images/whatever.png");

同样,如果您想更改“fooSpan”中的html,您只需执行以下操作要做的是:

$("#fooSpan").html("something else");

您甚至可以将这些与事件联系起来,这将为您提供比 onmouseover 属性更大的灵活性:

$(document).ready(function(){
$("#foo").mouseover(function(){
    $("#fooSpan").html("something else");
    $("#foo").attr("src","images/whatever.png");
    });
});

I'd STRONGLY urge you to consider using jQuery's built-in attr() method which integrates the function you want perfectly across browsers and is incredibly easy to use.

Using your example, if you wanted to change the "src" property for "foo", you could do it in a single line of code:

$("#foo").attr("src","images/whatever.png");

Similarly, if you wanted to change the html WITHIN "fooSpan", all you'd have to do is:

$("#fooSpan").html("something else");

You can even tie these to events that are going to give you a lot more flexibility than the onmouseover property:

$(document).ready(function(){
$("#foo").mouseover(function(){
    $("#fooSpan").html("something else");
    $("#foo").attr("src","images/whatever.png");
    });
});
〗斷ホ乔殘χμё〖 2024-07-30 22:25:11

我的建议是做这样的事情。

function fooFunction(sourceElement,property,propertyValue) {    
  var newElement = document.getElementById(sourceElement);
  newElement.setAttribute(property,propertyValue);
};

你的 HTML 看起来像:

<img src="foo.gif" id="foo" name="foo" 
           onmouseover="fooFunction('fooSpan','class','mouseover_span');"/>
<span id="fooSpan" name="fooSpan">some text here</span>

My suggestion would to do something like this.

function fooFunction(sourceElement,property,propertyValue) {    
  var newElement = document.getElementById(sourceElement);
  newElement.setAttribute(property,propertyValue);
};

And your HTML would look like:

<img src="foo.gif" id="foo" name="foo" 
           onmouseover="fooFunction('fooSpan','class','mouseover_span');"/>
<span id="fooSpan" name="fooSpan">some text here</span>
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文