`

js笔记1 隐藏显示

阅读更多

 

var obj=document.getElementById('id');

obj.onclick=function(){

obj.style.attr=value;

obj.dispabled=true/false;

obj.innerHTML=value;

obj.value=values;

obj.style.width=num+'px';

widhow.confirm(str)

obj.innerHTML='';

 

 

}

onmouseover  移入

onmouseout  移出

 

图片:所有的相对路径,都不要用于判断

img src

href='1.css' href='httm/1.html'

color也不要拿来判断

 

innerHTML的值别拿来用于判断(兼容性问题)

 

图片绝对路径可以用于判断

 

兼容性的话obj.type='checkbox'(不支持ie6到8,会报错)

 

如果要兼容性,可以先将input(下面的那些复选框之类的隐藏后)

在对对应的input先隐藏再显示出来

操作其他代码

 

如果希望改变页面中的那个div的浮动;

处理兼容性问题

obj.style.float='left';

如果是ie(styleFloat);

如果不是ie(cssFloat);

obj.className='class';

 

切换方式

不动态变化使用obj.width //.后面的值不能修改

动态变化要使用obj [key]

D1.style[Attr.value]=Val.value;

obj.attr=value 只能对单一属性进行处理,不能处理多个属性(静态的)

var D1=document['getElementById']('d1');

obj[key]=function () {

                value

            }

obj[key]=value

js中允许.替换成[]

obj[key]=value

其中key可能是字符串

这个用法,在后台编程语言中,经常使用,还有在json中使用

在学习过程中,如果遇到兼容性问题的话

建议在style样式表中,先编写好指定的class{key:value}样式表方式

然后在js中,通过doc....方式来获取style中的class样式表名称

使用如下

obj.className=class;

 

 

判断用法

if(exr){}

if(exr){

}else{

}

 

if(exr1){

 

}

else if(exr2){

 

}

else{

 

}

 

分享到:
评论

相关推荐

    javascript学习笔记(1) 缓动效果显示隐藏div

    在JavaScript学习过程中,缓动效果是一种常见的动画技术,它能够为网页元素的显示与隐藏添加平滑过渡,提升用户体验。本篇文章将聚焦于如何利用JavaScript实现缓动效果来控制div的显示与隐藏。 首先,我们需要了解...

    js 排序和自动隐藏表格格的笔记

    在JavaScript(JS)中,排序和自动隐藏表格是常见的需求,尤其在数据处理和用户界面交互时。这篇笔记将深入探讨这两个主题。 首先,我们来讨论JavaScript中的排序。JavaScript提供了`Array.prototype.sort()`方法,...

    jquery完全笔记 带目录 高清 经典前端js笔记 前端必看

    ### jQuery完全笔记知识点概述 #### 1. jQuery概述 jQuery是一个快速、小型且功能丰富的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互。通过使用jQuery,可以更方便地在网页中操作文档对象、选择...

    JavaScript学习笔记,javascript基础知识,基础语法整理.pdf

    * 图片对象可以实现图片的显示和隐藏 七、 JavaScript 在表单中的应用 * 表单是HTML中的一种基本结构单元 * 表单可以使用JavaScript来实现交互功能 * 表单可以使用JavaScript来实现数据的验证 * 表单可以使用...

    JS AngularJS 学习笔记

    例如,`ngRepeat`用于循环遍历数组并创建视图,`ngIf`根据条件控制元素的显示与隐藏,`ngClass`动态改变元素的CSS类等。这些指令使开发者能以声明式的方式处理DOM操作,增强了HTML的表现力。 **5. 模块化** ...

    js和jquary随堂笔记

    `hide()`、`show()` 方法用于隐藏和显示元素,支持速度参数,如 `$("p").hide(1000);`。`toggle()` 方法则能在点击事件中切换显示和隐藏状态。滑动效果由 `slideDown()`、`slideUp()` 和 `slideToggle()` 实现,它们...

    html+css+js总结笔记

    - 使用 JavaScript 控制 DOM 的修改,比如隐藏或显示特定元素。 - 动态更改页面的部分内容,如通过 AJAX 技术异步加载新的内容片段。 - 利用框架或库(如 React 或 Vue.js)的特性来更新视图而无需完全刷新页面。 ...

    js菜鸟笔记之树级菜单_ekom.cn

    虽然给定的内容中没有直接提供JavaScript代码,但可以推测其核心逻辑在于通过点击事件控制子菜单的显示与隐藏。具体实现方式可能包括: - 绑定点击事件到每个`<dt>`元素; - 在点击事件处理函数中,切换当前菜单项的...

    蓝杰JavaScript学习笔记

    《蓝杰JavaScript学习笔记》是一份综合性的JavaScript学习资料,主要涵盖了JavaScript在网页动态操作、DOM操作以及事件处理等方面的基础知识。这篇笔记通过多个实例文件,如`dynamicCreateTable.htm`、`...

    我的JQuery笔记.doc

    2. 隐藏/显示元素:$.hide()和$.show(),隐藏或显示元素。可传入时间参数实现过渡效果,例如:$.hide(1000)表示1秒后隐藏。 3. 切换显示状态:$.toggle(),点击元素时切换其隐藏和显示状态。 4. 移除元素:$.remove...

    js学习笔记

    在更复杂的功能中,JS可以实现树型结构的创建、无边框效果、联动下拉框技术、文本排序、画图类(如饼图、柱状图和贝塞尔曲线)、客户端注册表操作、DOM操作如DIV层的拖拽、显示、隐藏、移动和增加,以及TABLE的相关...

    智能社JavaScript系列视频案例笔记

    6. **显示与隐藏元素**:案例6展示了如何通过JavaScript控制元素的可见性。`showHide`函数根据`display`属性的状态判断元素是否显示,从而实现显示和隐藏的效果。 7. **JavaScript链接**:在HTML的`<a>`标签中,`...

    JavaScript笔记

    强调:1.js区分大小写 2.字符串单双引号不区分 [removed]标签:页面中专门集中编写JavaScript的区域 js的方法定义:function方法名([参数列表]){ 方法体 [return 返回值] } 注意:js中的方法可以直接写在代码...

    李炎恢Bootstrap讲义笔记

    4. **响应式工具**:Bootstrap提供了诸如`.visible-*`和`.hidden-*`类,用于控制不同设备视口下的元素显示和隐藏,确保页面在各种设备上都能正确显示。 5. **自定义Bootstrap**:笔记可能详细解释了如何通过修改...

    轻笔记网页设计htm

    JavaScript则增强了网页的交互性,例如处理用户输入、验证表单数据、显示或隐藏元素等。在登录和注册过程中,JavaScript可以实时检查用户名和密码的有效性,避免无效提交,也可以提供诸如记住密码、自动填充等便捷...

    课堂笔记.zip

    6. **鼠标悬停**:"selenium课堂笔记_鼠标悬停.py"可能涉及模拟鼠标悬停事件,这对于触发隐藏元素的显示或某些交互式效果的测试是必要的。 7. **滚动条的操作**:"selenium课堂笔记_滚动条的操作.py"可能讲解了如何...

    ExtJS4中文教程2 开发笔记 chm

    Jquery中显示隐藏的实现代码分析 JQuery全选功能的实现 JQuery特效——下拉菜单 JQuery系列教程之XPath选择符 JQuery系列教程之选择符 JQuery自动缩放页面中的图片 JQuery获取浏览器的高度和宽度 jquery获得和设置...

    Javascript技术笔记3

    ### JavaScript技术笔记精要 #### 一、CSS样式与JavaScript交互 **1.1 `word-break: break-all`** 在CSS中,`word-break: break-all`是一个非常实用的属性,用于解决长单词或URL超出容器宽度时的换行问题。当一行...

    高级笔记本

    4. **代码折叠**:允许用户将代码块折叠起来,隐藏不重要的细节,只显示代码的大纲,这对于处理大型项目尤其有用,能保持工作区的整洁。 5. **查找与替换**:强大的查找和替换功能,不仅支持简单的文本搜索,还能...

Global site tag (gtag.js) - Google Analytics