03 jQuery属性控制

属性相关的控制主要有以下几个功能

val()  => 处理value属性

text()  => 处理innerText

html()  => 处理innerHTML

attr()  => 处理所有属性的

css()  => 处理所有css样式的

仔细看下吧，简单的很：

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="jquery.min.js"></script>

    <script>

        $(function(){

            // 如果给参数, 就是设置值, 如果没参数, 就是获取值

            $("#text_1").val("我是谁?");

            console.log($("#text_1").val());

            // attr() 如果给一个参数. 就是获取值. 如果给2个参数就是设置属性值

            $("#text_2").attr("type", "button").val("god");

            console.log($("#text_2").attr("type"));

            // css() 如果一个参数, 取值, 如果2个参数, 设置值

            $("#mydiv").css("background", "#eee");

            console.log($("#mydiv").css("background"))

            // text()和html()很像.

            console.log($("#mydiv_2").text())  // 拿到纯文本

            console.log($("#mydiv_2").html())  // 拿到html标签

            // 如果传参. 则text(xxx)把xxx作为文本放入标签内.

            //          则html(xxx)把xxx作为html放入标签.

        })

    </script>

</head>

<body>

    <input type="text" name="" id="text_1">

    <input type="text" name="" id="text_2">

    <div id="mydiv" style="width: 200px;height:100px; background:pink;"></div>

    <div id="mydiv_2" >

        <span>哈哈</span>

        <span>呵呵</span>

    </div>

</body>

</html>

03 jQuery属性控制的更多相关文章

  1. css,js,jquery的载入方式和属性控制

    本文章主要总结了css,js,jQuery在编写程序时的载入方式,与属性控制方式html和css共同组成了一个最基础的网页,js为标签样式提供动态效果 一,css的载入方式与属性控制 1.1,css引 ...

  2. 深入学习jQuery动画控制

    × 目录 [1]动画状态 [2]停止动画 [3]动画延迟[4]全局控制 前面的话 jQuery动画可以使用fade.hide.slide等方法实现基本动画效果,可以使用animate实现自定义动画,甚 ...

  3. jQuery属性和样式操作

    回顾 1. jquery基本使用 <script src="jquery.min.js"></script><script> $(functio ...

  4. jQuery属性/CSS使用例子

    jQuery属性/CSS 1..attr() 获取匹配的元素集合中的第一个元素的属性的值  或 设置每一个匹配元素的一个或多个属性. 例1:获取元素的属性的值 <p title="段落 ...

  5. jQuery源代码学习之八——jQuery属性操作模块

    一.jQuery属性模块整体介绍 jQuery的属性操作模块分四个部分:html属性操作,dom属性操作,类样式操作,和值操作. html属性操作(setAttribute/getAttribute) ...

  6. jQuery 属性操作和CSS 操作

    如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果) jQuery 属性操作方法(以下方法前些日子学习过,不再赘述) addClass() attr() ...

  7. jquery选择器控制Html元素

    1.JQuery中有addClass,removeClass,toggleClass addClass(class):为每个匹配的元素添加指定的类名 removeClass(class):从所有匹配的 ...

  8. jQuery属性操作总结

    jquery属性包括以下几个: attr(name|pro|key,val|fn) removeAttr(name) prop(n|p|k,v|f)1.6+ removeProp(name)1.6+ ...

  9. jQuery 效果函数，jquery文档操作，jQuery属性操作方法，jQuerycss操作函数，jQuery参考手册-事件，jQuery选择器

    jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数( ...

  10. 前端开发之jQuery属性和文档操作

    主要内容: 1.jQuery属性操作 2.jQuery文档操作 一.jQuery属性操作 1.什么是jQuery的属性操作? jQuery的属性操作模块包括四个部分:html属性操作,dom属性操作, ...

随机推荐

  1. MySQL重新设置auto_increment值

    需求描述 通常,我们都会在数据库表中设置一个自增字段作为主键,该字段的值会随着添加新记录而自增. 同时也必须注意,这个自增字段的值只会一直增加,即使把记录删除了,该自增字段的值也不会变小. 因此,就会 ...

  2. 麒麟系统开发笔记（五）：制作安装麒麟系统的启动U盘、物理机安装麒麟系统以及搭建Qt开发环境

    前言   电脑从U盘装麒麟系统,搭建实机Qt开发运行环境.   制作麒麟系统U盘(使用LiveUSB) 步骤一:先准备个至少8GB的U盘   之前购买的一批联想U盘,如下图:    查看U盘:   步 ...

  3. 通过Glide加载不可见的图片

    今天遇到一个需求,需要点击分享的时候生成图片以及二维码. 即:将带有图片以及二维码的布局文件生成Bitmap,当然这个布局文件是后台生成的,并不可见,这时候会发现使用Glide加载图片没有反应. 源码 ...

  4. Java 线程通信的应用：经典例题：生产者/消费者问题

    1 package bytezero.threadcommunication; 2 3 /** 4 * 线程通信的应用:经典例题:生产者/消费者问题 5 * 6 * 7 * 8 * @author B ...

  5. PHP四则运算类(支持加、减、乘、除、小中括号)

    <?php /** * 四则运算(支持加.减.乘.除.小中括号) * Class calculator */ class calculator { //保留几位小数点 public $point ...

  6. 照片也能说话了？嘴型表情全同步，AI数字人时代要来了

    SadTalker是一款先进的人工智能模型,它通过从音频中学习生成3D运动系数,并使用全新的三维面部渲染器来生成头部运动,只需传入一张照片和一段音频,就能生成高质量的AI数字人视频 工作原理 1.显式 ...

  7. liunx 安装 python 虚拟环境， 各种方法，

    liunx 安装 python 虚拟环境,主要是要解决工作中需要用到python3.6,但是系统的2.7又不能动,安装系统组件时避免造成冲突.低版本的python安装django  uwsgi 等都用 ...

  8. Zabbix6.0使用教程 (二)—zabbix6.0常用术语

    上一次我们已经详细介绍了zabbix6.0的新增功能,本篇我们来说说zabbix6.0常用的一些术语,这个对小伙伴日常使用zabbix的时候还是非常有用,建议大家收藏起来,话不多说,附上干货. 概览 ...

  9. Mac下使用Docker快速布署FastGPT实现AI私有知识库

    FastGPT 是一个基于 LLM 大语言模型的知识库问答系统,提供开箱即用的数据处理.模型调用等能力.同时可以通过 Flow 可视化进行工作流编排,从而实现复杂的问答场景! 官网地址为:https: ...

  10. C#串口开发之SerialPort类封装

    目录 SerialPort类 参数封装 控件操作封装 SerialPortClient类实现 SerialPortClient类使用 测试Demo 参考文章 SerialPort类 微软在.NET中对 ...