Jquery Dom节点常用操作

select 标签

  form提交的时候 提交select标签选中的value值

1. 添加项

  $("#select_id").append("<option value=‘Value‘>Text</option>");  //添加一项option

  $("#select_id").prepend("<option value=‘0‘>请选择</option>"); //在前面插入一项option

2. 删除项

  $("#select_id option:first").remove(); //删除第一项

  $("#select_id option:last").remove(); //删除最后一项

  $("#select_id option[index=‘0‘]").remove();//删除索引值为0的Option

  $("#select_id option[value=‘3‘]").remove(); //删除值为3的Option

  $("#select_id option[text=‘4‘]").remove(); //删除TEXT值为4的Option

3. 清空项

  $("#select_id").empty();

  $("#select_id").html(‘‘);

4. 设置select选中项

  设置select选中的索引

 $("#select_id").get(0).selectedIndex=index;// index为索引值

  设置select 选中的value:

 $("#select_id option[value=‘value2‘]").attr("selected", "selected");

$("#select_id").attr("value","Normal“);

$("#select_id").val("Normal");

$("#select_id").get(0).value = value;

  试图设置select的text值都是无效的。

5. 获取select选中项

  $("#select_id ").val();//获取select 所有的value值

  $("#select_id ").text();//获取select 所有的text值

  $(‘#select_id option:selected‘).val();  $(‘#select_id‘).find("option:selected").val()//获取select 选中的value值

  $(‘#select_id option:selected‘).text();  $(‘#select_id‘).find("option:selected").text()//获取select 选中的text值

  $(‘#select_id‘).get(0).selectedIndex; //获取select选中的索引

6. 触发事件

  $(‘#select_id‘).change(function () {
                alert(‘you click select_id‘);
            });

input[type=checkbox] 标签

  form提交的时候 当checkbox被选中时,字段被提交;当checkbox不被选中时,字段不被提交

时间: 2024-10-10 03:17:01

Jquery Dom节点常用操作的相关文章

JQuery DOM 的常用操作

一.JQuery对象的基本方法: (1) get(); 取得所有匹配的元素(2) get(index); 取得其中一个匹配的元素 $(this).get(0) 等同于 $(this)[0](3) Number index(jqueryObj); 搜索子对象(4) each(callback); 类似foreach,不过遍历的是元素数组    如: $("img".each(function(index){ this.src = "test" + index + &q

dom节点的操作

dom节点的操作 -- jQuery 内部插入 1.(结尾)append 方法 . appendto方法(为了方便链式操作) (开头)prepend方法 $('#div1').append($('#div2'));     //将div2 插入到 div1 里面的末尾 ? $('#div1').appendto($('#div2'));     //将div1 插入到 div2 里面的末尾 ? $('#div1').prepend($('#div2'));     //将div2 插入到 div

jQuery DOM 节点操作

DOM 中有一个非常重要的功能,就是节点模型,也就是 DOM 中的“M”.页面中的元素结构就是通过这种节点模型来互相对应着的,我们只需要通过这些节点关系,可以创建.插入.替换.克隆.删除等等一些列的元素操作. 一.创建节点 为了使页面更加智能化,有时我们想动态的在 html 结构页面添加一个元素标签,那么 在插入之前首先要做的动作就是:创建节点. $('div').append('<strong>节点</strong>'); //向 div 内部插入 strong 节点 $('di

jQuery DOM节点操作 - 父节点、子节点、兄弟节点

------------------------------------------------------------------- 源文地址: http://www.cnblogs.com/yunlei0821/p/7577400.html ,转载请务必保留此出处. 子(/孙)节点: .children([selector]). 获得匹配元素集合中每个元素的所有直接子元素(选择器可选). 实例: <div> <a href="#"><span>w

js、jquery对节点的操作(增、删)

js对节点的操作方法 一.获取 1.父节点的获取 某节点的parentNode属性值即为该节点的父节点.示例: var parent = document.getElementById("one").parentNode; 2.兄弟节点的获取 nextElementSibling和nextSibling属性配合使用. 某节点的nextElementSibling属性值是该节点后面紧邻的兄弟节点,但是这个有兼容性,在ie9以上版本(包含ie9)和其他浏览器,结果是我们想要的弟节点,在ie

JS中的DOM— —节点以及操作

DOM操作在JS中可以说是非常常见了吧,很多网页的小功能的实现,比如一些元素的增删操作等都可以用JS来实现.那么在DOM中我们需要知道些什么才能完成一些功能的实现呢?今天这篇文章就先简单的带大家入一下JS中DOM操作的门吧!! 一.DOM树的节点 1. DOM节点分为三大类: 元素节点(标签节点).属性节点和文本节点. 属性节点和文本节点都属于元素节点的子节点. 因此操作时,需先选中元素节点,再修改属性和文本. [查看元素节点] 1. 使用getElement系列方法: 具体的HTML代码如下图

jquery中节点的操作以及一些其他方法的操作

Jquery中节点操作 1.   创建节点: $(‘html字符串’): 如$(‘<p>hello jquery</p>’); 2.   添加节点: append  ,  appendTo  添加到元素内容的最后面 $('.father').append($('p')); $('h2').appendTo($('.father')); prepend ,  prependTo  添加到元素内容的最前面 $('.father').prepend($('p')); $('h2').pr

jQuery DOM节点操作

一.创建节点 var box = $('<div id =box>节点</div>');  //创建一个节点 $('body').appended(box); //将节点插入<body>元素内部 二.插入节点 内部插入节点方法 append(content)     向指定元素后面插入节点content append(function (index,hml) {}) 使用匿名函数向指定元素后面插入节点content(html是原节点) appendTo(content)

jQuery自学笔记(四):jQuery DOM节点操作

获得和设置内容:text( ).html( ) 以及 val( ) text( ) - 设置或返回所选元素的文本内容 html( ) - 设置或返回所选元素的内容(包括 HTML 标记) val( ) - 设置或返回表单字段的值 例子: $("#btn1").click(function(){   $("#test1").text("Hello world!"); }); $("#btn2").click(function()