JavaScript中用jquery获取鼠标的定位和对节点文本操作

jquery


<script scr="https://cdn.bootcss.com/blueimp-md5/2.10.0/js/md5/2.10.0/js/md5.min.js">
script>
<body>
    <a href=" " id = "text-jquery">点我a>
    //选择器接收css的选择器
   $('#text-jquery').click(function(){
    alert('hello.jquery');
})
  body>

css选择器


 
    <a href="" id="text-jquery" name="text-jquery">点我a>
    <script>
        
        $('#text-jquery').click(function () {
            console.log('hello.jquery');
        })
    script>

原生的document的js,选择器少，麻烦不好记


//标签
document.getElementByTagName();
//id
document.getElementById();
//类
document.getElementByIdClassName();
//jquery css中的选择器它全部能用
$('p').click();//标签选择器
$('#id1').click()//id选择器
$('.class').click()//class选择器

获取鼠标的定位


    <style>
        #divMove {
            width: 500px;
            height: 500px;
            border: 1px solid red;
        }
    style>
    
    mouse:<sapn id="mouseMove">sapn>
    <div id="divMove">
        点击这里试一试
    div>
    <script>
        $(function () {
            $('#divMove').mousemove(function (e) {
                $('#mouseMove').text('x:' + e.pageX + 'y:' + e.pageY)
            })
        });
    script>

节点文本操作


"text-ul">
    <li class="js">javaScriptli>
    <li name="phthon" >phthonli>

<body>
<script>
$('text-ul li[name=phthon]').text();//获取的值
$('text-ul').html('设置值');
script>
body>
$('#')


$('#text-ul li[name=phthon]').text();//获取的值
$('#text-ul li[name=phthon]').text('设置值')//设置值
$('#text-ul').html();//获取值
$('#text=ul').html('134');//设置值
//有"" 的为设置值

css的操作

$('#text-ul li[name=phthon]').css({"color","red"})//使用键值对可以对多个属性进行赋值

元素的显示和隐藏：本质： diplay: none;

$('#text-ul li[name=phthon]').show() $('#text-ul li[name=phthon]').hide()

$(window).width() $(window).height() $('#text-ul li[name=phthon]').toggle()//这个包含了显示和隐藏可随时切换

原始数据类型：null 、undefined 、字符串、数、布尔值和Symble
派生数据类型/对象： javaScript对象。包括函数、数组和正则表达式
true和false在javaScript中如何进行转换

undefined false null false 布尔值 true是true,flase是flase 数 +0、-0和NaN都是false ,其他都是true 字符串如果字符串是空的(长度为0)就是false，其他都是true(长度大于等于一) 对象 true

例如:

function testTruthy(val){ return val?console.log('true'):console.log('false'); } testTruthy(new Boolean (false));//输出的结果为true(所有的对象都是true)

Symple是ES6新引入数据类型，表示独一无二的值
testTruthy({})输出的是对象故结果为true
toNumber方法对不同类型返回的结果

undefined NaN null +0 布尔值如果是true,返回1;如果是false 返回+0

toPrimitive方法对不同的类型返回的结果如下
如果对象是valueOf方法的结果是原始值，返回原始值；如果对象的toString方法返回原始值就返回这个值：其他情况都返回一个错误