jquery javascript equivalent

Question

I use too much jquery

I want to do this with out jquery:

<a onclick="javascript:$(this).next().css('display', 'none')">

I thought it was this:

<a onclick="javascript:this.nextSibling.style.display = 'none'">

But its not. Style returns undefined.

Let me clarify:

I want to do this:

<a class="errorToggle">error</a>
<div style="padding-left:20px;margin:0 0 10px 0;display:none;">

<h4>A PHP Error was encountered</h4>

<p>Severity: <?php echo $severity; ?></p>
<p>Message:  <?php echo $message; ?></p>
<p>Filename: <?php echo $filepath; ?></p>
<p>Line Number: <?php echo $line; ?></p>

</div>

<script type="text/javascript">
  $(".errorToggle").click(function(){
    $(this).next().css("display", "block");
  });
</script>

Without jQuery BECAUSE this is a code igniter error view file that quite often will load before my header does, so I will not have access to jquery. It doesn't need to be pretty, or well coded, just work. This will not be used in production.

What do you mean by "too much" jQuery? If you use any at all, it's coming along for the ride, so you might as well use it. Also, if you are getting it from a CDN it's probably already cached in your visitors' browsers so there's not too much overhead. If you mean you don't want to use it AT ALL, I sympathize. If only Netscape had given Microsoft the source code (or even just the specs) to start with, the poor dears wouldn't have had to try to reverse engineer it in order to steal it, and browser compatibility would be much better. — Duncan
– Duncan, Commented Jan 21, 2010 at 2:40
jQuery or no jQuery, you don't want javascript: at the start of your event handlers. — bobince
– bobince, Commented Jan 21, 2010 at 3:03
This is a quick fix I am adding to the php error view file in code igniter. It often will produce these errors before the header has loaded, hence, no jquery. Too much jquery, meaning, I just don't know how to do things with regular javascript these days, not that I don't want to use jquery any more. — Brandon G
– Brandon G, Commented Jan 21, 2010 at 18:00

o.k.w · Accepted Answer · 2010-01-21 02:18:16Z

6

Take a look at this article:
JavaScript nextSibling and Cross Browser Compatibility

Excerpt:

The problem was that we were referencing the 'nextSibling' of an element in our JS using the onClick event. In IE this worked great, however in Firefox the 'nextSibling' could be a line break.

You might want to iterate through the "nextSibling()" until you hit what you want.

answered Jan 21, 2010 at 2:18

o.k.w

25.9k6 gold badges68 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Erik Over a year ago

This is WHY you use a library like jQuery -- cross browser assured same-behavior. Write once, just works.

o.k.w Over a year ago

This is also WHY many of us are crippled without these libraries and frameworks. I'm one of those as well. Hah

o.k.w Over a year ago

@bobince: Really? Any reference?

bobince Over a year ago

It's one of those areas that fell between the cracks in that SGML says nothing at all about DOMs (only rendering) and W3 DOM said nothing at all about parsing, until DOM Level 3 Core and LS (which IE does not claim to support). Under DOM 3 LS one is to include all text content by default, unless the element-content-whitespace parameter is set to false, in which case whitespace-only text nodes are omitted in elements that the doctype defines as containing only other elements. (Most HTML elements have mixed content and not element content anyway.)

bobince Over a year ago

This is finally cleared up for good by HTML5 section 3.2.5 (though of course HTML5 is not yet a complete standard).

|

Collectives™ on Stack Overflow

jquery javascript equivalent

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related