JavaScript getElementById()
我正在尝试创建一个通用的 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 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(4)
可能这条线在 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.
您确定在 IE 中正确获取了 ID 吗? 也许在 IE 中传入的 ID 为空(也许 this.id 不起作用?)。
尝试这样称呼它:
看看是否有帮助。 我没有看到 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:
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.
我强烈建议您考虑使用 jQuery 的内置 attr() 方法,该方法跨浏览器完美地集成了您想要的功能,并且非常易于使用。
使用您的示例,如果您想更改“foo”的“src”属性,您可以在一行代码中完成:
同样,如果您想更改“fooSpan”中的html,您只需执行以下操作要做的是:
您甚至可以将这些与事件联系起来,这将为您提供比 onmouseover 属性更大的灵活性:
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:
Similarly, if you wanted to change the html WITHIN "fooSpan", all you'd have to do is:
You can even tie these to events that are going to give you a lot more flexibility than the onmouseover property:
我的建议是做这样的事情。
你的 HTML 看起来像:
My suggestion would to do something like this.
And your HTML would look like: