Re: focus() not working in IE when created by appendChild

liorean <[email protected]> Thu, 30 Aug 2007 14:55:30 +0200
Newsgroups gmane.comp.web.dom.wdf
Message-ID <[email protected]>
--HYbIa4tb1X-68Cx0J17nDlDnNdm2oPsQDffytJT
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 7bit

On 30/08/2007, Joseph Caprario <[email protected]> wrote:
>  Any ideas how to get the added "google_win" line to work properly or why it's not
>  working?

Oh, the problem is that you're expecting setting an HTML attribute
(you should spell that "onclick" by the way, not "onClick") to also
set an event handler on the element.

When the HTML engine parses HTML event attributes, it sets the DOM
attribute on the element, but also sets an event handler on it. Note
that those are separate steps. When scripting, you want to set the
event handler on it, you aren't really interested in setting the
attribute value. There are a number of ways to set event handlers:

DOM0:
    elm.onclick=function(ev){
            ev=ev||event;
            /* do something */
        };

IEW:
    elm.attachEvent('onclick',function(ev){
            /* do something */
        });

DOM2Events:
    elm.addEventListener('click',function(ev){
            /* do something */
        },false);


Of these, the DOM0 version works in all browsers (though it works
slightly differently in iew).
The IEW version of course works in in iew (and, I believe, in op. But
that might require op to be in iew spoofing mode).
The DOM2Events version in all modern browsers except for iew.
-- 
David "liorean" Andersson

--HYbIa4tb1X-68Cx0J17nDlDnNdm2oPsQDffytJT
Content-Type: text/html; charset=UTF-8
Content-Transfer-Encoding: 7bit


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>




<body style="background-color: #ffffff;">

<!--~-|**|PrettyHtmlStartT|**|-~-->
<div id="ygrp-mlmsg" style="width:655px; position:relative;">
  <div id="ygrp-msg" style="width: 490px; padding: 0 15px 0 0; float:left;  z-index:1;">
<!--~-|**|PrettyHtmlEndT|**|-~-->

    <div id="ygrp-text">
            <p>On 30/08/2007, Joseph Caprario &lt;<a href="mailto:joecap5%40comcast.net">joecap5@comcast.<wbr>net</a>&gt; wrote:<br>
&gt;  Any ideas how to get the added &quot;google_win&quot; line to work properly or why it's not<br>
&gt;  working?<br>
<br>
Oh, the problem is that you're expecting setting an HTML attribute<br>
(you should spell that &quot;onclick&quot; by the way, not &quot;onClick&quot;) to also<br>
set an event handler on the element.<br>
<br>
When the HTML engine parses HTML event attributes, it sets the DOM<br>
attribute on the element, but also sets an event handler on it. Note<br>
that those are separate steps. When scripting, you want to set the<br>
event handler on it, you aren't really interested in setting the<br>
attribute value. There are a number of ways to set event handlers:<br>
<br>
DOM0:<br>
    elm.onclick=<wbr>function(<wbr>ev){<br>
            ev=ev||event;<br>
            /* do something */<br>
        };<br>
<br>
IEW:<br>
    elm.attachEvent(<wbr>'onclick'<wbr>,function(<wbr>ev){<br>
            /* do something */<br>
        });<br>
<br>
DOM2Events:<br>
    elm.addEventListene<wbr>r('click'<wbr>,function(<wbr>ev){<br>
            /* do something */<br>
        },false);<br>
<br>
Of these, the DOM0 version works in all browsers (though it works<br>
slightly differently in iew).<br>
The IEW version of course works in in iew (and, I believe, in op. But<br>
that might require op to be in iew spoofing mode).<br>
The DOM2Events version in all modern browsers except for iew.<br>
-- <br>
David &quot;liorean&quot; Andersson<br>
</p>
    </div>  

    <!--~-|**|PrettyHtmlStart|**|-~-->
    <span width="1" style="color: white;">__._,_.___</span>
    <!-- Start the section with Message In topic -->
    <div id="ygrp-actbar">
              <span class="left">
          <a href="http://groups.yahoo.com/group/wdf-dom/message/5613;_ylc=X3oDMTM0YWdnazJjBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBG1zZ0lkAzU2MTQEc2VjA2Z0cgRzbGsDdnRwYwRzdGltZQMxMTg4NDc4NTQzBHRwY0lkAzU2MTM-">
            Messages in this topic          </a> (<span class="bld">0</span>)
        </span>
        <a href="http://groups.yahoo.com/group/wdf-dom/post;_ylc=X3oDMTJwMWs0bHVxBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBG1zZ0lkAzU2MTQEc2VjA2Z0cgRzbGsDcnBseQRzdGltZQMxMTg4NDc4NTQz?act=reply&messageNum=5614">
          <span class="bld">
            Reply          </span> (via web post)
        </a>  | 
        <a href="http://groups.yahoo.com/group/wdf-dom/post;_ylc=X3oDMTJlMGc5dmRwBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwNmdHIEc2xrA250cGMEc3RpbWUDMTE4ODQ3ODU0Mw--" class="bld">
          Start a new topic        </a>
          </div> 
    <!-------     Start Nav Bar  ------>
    <!-- |**|begin egp html banner|**| -->
    <div id="ygrp-vitnav">
                <a href="http://groups.yahoo.com/group/wdf-dom/messages;_ylc=X3oDMTJlcjg2ZjIxBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwNmdHIEc2xrA21zZ3MEc3RpbWUDMTE4ODQ3ODU0Mw--">Messages</a>  
        
        
        
        
        
        
        
    </div>  
    <!-- |**|end egp html banner|**| -->

                <div id="ygrp-grft">
                  

              </div>
    
    <!-- yahoo logo -->
    <!-- |**|begin egp html banner|**| -->
    <div id="ygrp-ft">
      <a href="http://groups.yahoo.com/;_ylc=X3oDMTJkdWZqN25yBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwNmdHIEc2xrA2dmcARzdGltZQMxMTg4NDc4NTQz">
      <img src="http://us.i1.yimg.com/us.yimg.com/i/yg/img/logo/ma_grp_160.gif" height="15" width="106" border="0" alt="Yahoo! Groups"></a> <br>
      <a href="http://groups.yahoo.com/group/wdf-dom/join;_ylc=X3oDMTJmdmMyb2Q0BF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwNmdHIEc2xrA3N0bmdzBHN0aW1lAzExODg0Nzg1NDM-">Change settings via the Web</a> (Yahoo! ID required) <br>
      Change settings via email: <a href="mailto:[email protected]?subject=Email Delivery: Digest">Switch delivery to Daily Digest</a> | <a href = "mailto:[email protected]?subject=Change Delivery Format: Traditional">Switch format to Traditional</a> <br>

      <a href="http://groups.yahoo.com/group/wdf-dom;_ylc=X3oDMTJkYTZxNmZmBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwNmdHIEc2xrA2hwZgRzdGltZQMxMTg4NDc4NTQz">
        Visit Your Group 
      </a> |
      <a href="http://docs.yahoo.com/info/terms/">
        Yahoo! Groups Terms of Use      </a> |
      <a href="mailto:[email protected]?subject=">
        Unsubscribe      </a> 
    </div>     <!-- |**|end egp html banner|**| -->
  </div> <!-- ygrp-msg -->

  
  <!-- Sponsor -->
  <!-- |**|begin egp html banner|**| -->
  <div id="ygrp-sponsor" style="width:140px;float: left; clear: none; margin-left: 5px; background:white; margin-bottom:25px ;position:absolute; top:0; right: 0;">
    <!-- Network content -->
    
    <!-- Start vitality -->
    <div id="ygrp-vital">
              <div id="vithd">Recent Activity</div>
        <ul style="list-style-type:none; padding: 0; margin: 2px 0;">
                <li style="clear: both;">
      <div class="ct" style="float: right;"><span style="display:none">&nbsp;</span>1</div>
      <div class="cat"><a href="http://groups.yahoo.com/group/wdf-dom/members;_ylc=X3oDMTJmZjJkZnMxBF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwN2dGwEc2xrA3ZtYnJzBHN0aW1lAzExODg0Nzg1NDM-">New Members</a></div>
    </li>
  
            
            
            
            
            
        </ul>
            <a href="http://groups.yahoo.com/group/wdf-dom;_ylc=X3oDMTJldnRndTI2BF9TAzk3MzU5NzE0BGdycElkAzI1NjQ1NjMEZ3Jwc3BJZAMxNzA1MDE2MDYxBHNlYwN2dGwEc2xrA3ZnaHAEc3RpbWUDMTE4ODQ3ODU0Mw--">
        Visit Your Group      </a>
    </div> 
              
    <!-- Network content -->
              <div id="nc">
              <div class="ad">
                      <div id="hd1">Dog Groups</div> 
<p><a href="http://us.ard.yahoo.com/SIG=12jisn3rc/M=493064.11292562.11840176.8674578/D=groups/S=1705016061:NC/Y=YAHOO/EXP=1188485743/A=4836043/R=0/SIG=11o19ppl5/*http://advision.webevents.yahoo.com/dogzone/index.html">on Yahoo! Groups</a></p> 
<p>Share pictures &amp;</p> 
<p>stories about dogs.</p>                  </div>
                    <div class="ad">
                      <div id="hd1">HDTV Support</div> 
<p><a href="http://us.ard.yahoo.com/SIG=12j7vurtp/M=493064.10972170.11554072.8674578/D=groups/S=1705016061:NC/Y=YAHOO/EXP=1188485743/A=4670553/R=0/SIG=11f8fj6tf/*http://tech.groups.yahoo.com/group/samsunghd/">on Yahoo! Groups</a></p> 
<p>Help with Samsung</p> 
<p>HDTVs and devices</p>                  </div>
                    <div class="ad">
                      <div id="hd1">Yahoo! Groups</div> 
<p><a href="http://us.ard.yahoo.com/SIG=12ju4vkiu/M=493064.10729651.11333342.8674578/D=groups/S=1705016061:NC/Y=YAHOO/EXP=1188485743/A=4617365/R=0/SIG=115gt68pf/*http://moderators.groups.yahoo.com/">Moderator Central</a></p> 
<p>Connecting a world</p> 
<p>of moderators</p>                  </div>
          </div>
    
  </div>   <!-- |**|end egp html banner|**| -->
  <div style="clear:both; color: #FFF; font-size:1px;">.</div>
</div>   <img src="http://geo.yahoo.com/serv?s=97359714/grpId=2564563/grpspId=1705016061/msgId=5614/stime=1188478543/nc1=4836043/nc2=4670553/nc3=4617365" width="1" height="1"> <br>

<span  style="color: white;">__,_._,___</span>
<!--~-|**|PrettyHtmlEnd|**|-~-->
</body>
<!--~-|**|PrettyHtmlStart|**|-~-->
<head>
<style type="text/css">
<!--
#ygrp-mkp{
  border: 1px solid #d8d8d8;
  font-family: Arial;
  margin: 14px 0px;
  padding: 0px 14px;
}
#ygrp-mkp hr{
  border: 1px solid #d8d8d8;
}
#ygrp-mkp #hd{
  color: #628c2a;
  font-size: 85%;
  font-weight: bold;
  line-height: 122%;
  margin: 10px 0px;
}
#ygrp-mkp #ads{
  margin-bottom: 10px;
}
#ygrp-mkp .ad{
  padding: 0 0;
}
#ygrp-mkp .ad a{
  color: #0000ff;
  text-decoration: none;
}
-->
</style>
</head>
<head>
<style type="text/css">
<!--
#ygrp-sponsor #ygrp-lc{
  font-family: Arial;
}
#ygrp-sponsor #ygrp-lc #hd{
  margin: 10px 0px;
  font-weight: bold;
  font-size: 78%;
  line-height: 122%;
}
#ygrp-sponsor #ygrp-lc .ad{
  margin-bottom: 10px;
  padding: 0 0;
}
-->
</style>
</head>
<head>
<style type="text/css">
<!--
#ygrp-mlmsg {font-size:13px; font-family: arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
#ygrp-mlmsg table {font-size:inherit;font:100%;}
#ygrp-mlmsg select, input, textarea {font:99% arial,helvetica,clean,sans-serif;}
#ygrp-mlmsg pre, code {font:115% monospace;*font-size:100%;}
#ygrp-mlmsg * {line-height:1.22em;}
#ygrp-text{
    font-family: Georgia;	
}
#ygrp-text p{
    margin: 0 0 1em 0;
}
#ygrp-tpmsgs{
    font-family: Arial;	
    clear: both;
}
#ygrp-vitnav{
	padding-top: 10px;
	font-family: Verdana;
	font-size: 77%;
	margin: 0;
}
#ygrp-vitnav a{
	padding: 0 1px;
}
#ygrp-actbar{
	clear: both;
	margin: 25px 0;
	white-space:nowrap;
	color: #666;
	text-align: right;
}
#ygrp-actbar .left{
	float: left;
	white-space:nowrap;
}
.bld{font-weight:bold;}
#ygrp-grft{
	font-family: Verdana;
	font-size: 77%;
	padding: 15px 0;
}
#ygrp-ft{
  font-family: verdana;
  font-size: 77%;
  border-top: 1px solid #666; 
  padding: 5px 0; 
}
#ygrp-mlmsg #logo{
  padding-bottom: 10px;
}

#ygrp-vital{
	background-color: #e0ecee;
	margin-bottom: 20px;
	padding: 2px 0 8px 8px;
}
#ygrp-vital #vithd{
	font-size: 77%;
	font-family: Verdana;
	font-weight: bold;
	color: #333;
	text-transform: uppercase;
}
#ygrp-vital ul{
	padding: 0;
	margin: 2px 0;
}
#ygrp-vital ul li{
  list-style-type: none;
  clear: both;
  border: 1px solid #e0ecee;  
}
#ygrp-vital ul li .ct{
  font-weight: bold;
  color: #ff7900;
  float: right;
  width: 2em;
  text-align:right;
  padding-right: .5em;
}
#ygrp-vital ul li .cat{
  font-weight: bold;
}
#ygrp-vital a{
	text-decoration: none;
}

#ygrp-vital a:hover{
  text-decoration: underline;
}

#ygrp-sponsor #hd{
	color: #999;
	font-size: 77%;
}
#ygrp-sponsor #ov{
	padding: 6px 13px;
	background-color: #e0ecee;
	margin-bottom: 20px;
}
#ygrp-sponsor #ov ul{
	padding: 0 0 0 8px;
	margin: 0;
}
#ygrp-sponsor #ov li{
	list-style-type: square;
	padding: 6px 0;
	font-size: 77%;
}
#ygrp-sponsor #ov li a{
	text-decoration: none;
	font-size: 130%;
}
#ygrp-sponsor #nc{
  background-color: #eee;
  margin-bottom: 20px;
  padding: 0 8px;
}
#ygrp-sponsor .ad{
	padding: 8px 0;
}
#ygrp-sponsor .ad #hd1{
	font-family: Arial;
	font-weight: bold;
	color: #628c2a;
	font-size: 100%;
	line-height: 122%;
}
#ygrp-sponsor .ad a{
	text-decoration: none;
}
#ygrp-sponsor .ad a:hover{
	text-decoration: underline;
}
#ygrp-sponsor .ad p{
	margin: 0;
}
o{font-size: 0; }
.MsoNormal{
   margin: 0 0 0 0;
}
#ygrp-text tt{
  font-size: 120%;
}
blockquote{margin: 0 0 0 4px;}
.replbq{margin:4}
-->
</style>
</head>
<!--~-|**|PrettyHtmlEnd|**|-~-->
</html><!--End group email -->


--HYbIa4tb1X-68Cx0J17nDlDnNdm2oPsQDffytJT--