标签: dom

是可能的切换元件的可见性,使用函数.hide(),.show()或.toggle().

如何测试元素是可见还是隐藏？

如何onclick使用JavaScript 更改HTML元素的类以响应事件？

所以jQuery 1.6具有新功能prop().

$(selector).click(function(){
    //instead of:
    this.getAttribute('style');
    //do i use:
    $(this).prop('style');
    //or:
    $(this).attr('style');
})

或者在这种情况下,他们做同样的事情？

如果我也有转用prop(),所有的旧attr()电话,如果我切换到1.6将打破？

UPDATE

selector = '#id'

$(selector).click(function() {
    //instead of:
    var getAtt = this.getAttribute('style');
    //do i use:
    var thisProp = $(this).prop('style');
    //or:
    var thisAttr = $(this).attr('style');

    console.log(getAtt, thisProp, thisAttr);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
<div id='id' style="color: red;background: orange;">test</div>

(另见这个小提琴:http://jsfiddle.net/maniator/JpUF2/)

控制台会记录getAttribute作为一个字符串,并attr作为一个字符串,但prop作为一个CSSStyleDeclaration,为什么？这对我未来的编码有何影响？

我想知道如何获得HTML元素的X和Y位置,例如img和divJavaScript.

我想在JavaScript中找出目前关注哪个元素.我一直在浏览DOM,但还没找到我需要的东西.有没有办法做到这一点,以及如何？

我之所以在寻找这个:

我正在尝试制作像箭头一样的键,并enter在输入元素表中导航.选项卡现在可以使用,但是输入,并且默认情况下不显示箭头.我已经设置了密钥处理部分,但现在我需要弄清楚如何在事件处理函数中移动焦点.

我正在重构一些旧的JavaScript代码,并且正在进行大量的DOM操作.

var d = document;
var odv = d.createElement("div");
odv.style.display = "none";
this.OuterDiv = odv;

var t = d.createElement("table");
t.cellSpacing = 0;
t.className = "text";
odv.appendChild(t);

我想知道是否有更好的方法来使用jQuery.我一直在尝试:

var odv = $.create("div");
$.append(odv);
// And many more

但我不确定这是否更好.

有一个表格列我正在尝试展开和隐藏:

td当我按类而不是按元素名称选择它时,jQuery似乎隐藏了元素.

例如,为什么:

$(".bold").hide(); // selecting by class works
$("tcol1").hide(); // select by element name does not work

请注意下面的HTML,第二列对所有行都具有相同的名称.我怎么能用name属性创建这个集合？

<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>
<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>  
<tr>    
    <td>data1</td>
    <td name="tcol1" class="bold"> data2</td>
</tr>

是否有一种有效的方法来判断DOM元素(在HTML文档中)当前是否可见(出现在视口中)？

(关于Firefox的问题)

我最近遇到了一个相当讨厌的错误,其中代码是<select>通过JavaScript动态加载的.这种动态加载<select>具有预先选择的值.在IE6中,我们已经有了修复所选内容的代码<option>,因为有时它<select>的selectedIndex值与所选<option>的index属性不同步,如下所示:

field.selectedIndex = element.index;

但是,此代码无效.即使selectedIndex正确设置了字段,最终也会选择错误的索引.但是,如果我alert()在正确的时间插入声明,则会选择正确的选项.考虑到这可能是某种时间问题,我尝试了一些随机的东西,我之前在代码中看到过:

var wrapFn = (function() {
    var myField = field;
    var myElement = element;

    return function() {
        myField.selectedIndex = myElement.index;
    }
})();
setTimeout(wrapFn, 0);

这有效!

我已经找到了解决问题的方法,但是我很不安,因为我不知道为什么这会解决我的问题.有人有官方解释吗？使用"稍后"调用我的功能可以避免哪些浏览器问题setTimeout()？

我有一个页面,其中一些事件监听器附加到输入框和选择框.有没有办法找出哪些事件监听器正在观察特定的DOM节点以及哪些事件？

事件附件使用:

1. 原型的 Event.observe ;
2. DOM的addEventListener;
3. 作为元素属性element.onclick.